JavaScript is normally run on your page in one of three ways. First, if the script is written directly in a <script> HTML element or an attached JavaScript file, then it will run when it is loaded. So, the following script would run when a page is opened or refreshed:

alert("The page was reloaded.");

The second way is for a function to be called. So, let's say that we include the following script at the top of a page:

function CreateMyOwnPopup(){
  alert("Here's my popup.");
}

This script will register the CreateMyOwnPopup function, but the page won't actually do anything until something calls the function, such as if we included the following later in the page:

CreateMyOwnPopup();

And the third way that JavaScript is typically run on a webpage is in conjunction with a listener. Listeners are registered when the page is loaded, and then they run the script inside them when they hear the listener being activated. For instance, the following script would find a button with the id button1 and run the CreateMyOwnPopup function any time the button is clicked:

document.getElementById('button1').addEventListener('click', function() {
  CreateMyOwnPopup();
});

In this case, JavaScript registers a listener on the button1 element to do something every time the click event occurs (i.e., someone clicks on it). See below for this example in action:

Additionally, jQuery has a shorter way of adding the same shortcut as follows:

$('#button1').on('click', function() {
  CreateMyOwnPopup();
}

JavaScript can listen for many different types of events, and available events can vary based on the element you are listening to, but some common examples include click, change, keyup, keydown, and scroll.