Button click function not working via ajax call

Question

I'm going to try to keep this simple.

I have a function that calls a modal pop up via ajax, it loads in all the images saved to a database. This modal displays the images, and gives you the option to click another button to "insert" an image into a form. (It puts the image on the main page, and inserts the image id into a hidden input field.)

I had this working with an 'onclick="functionName()"' option, but since I'm still learning js and jQuery, I found this way was older. So I've been working on updating my code.

Here is what I've got, and I've done a few hours of research, and from what I can guess, since the ajax loads these new function calls, the DOM isn't recognizing them as a "call" to the JS function?

If anyone can help or point me in the right direction, I'd greatly appreciate it.

//Ajax Modal Button:
<img/>
<button type="button" class="insertPageImages">Insert Image</button>

//JS Function
$(function(){
     $('button.browsePageImages').on('click', (function(e){
          //Loads Ajax Modal For insertPageImages Button
     }));

     $('button.insertPageImages').on('click', (function(e){
        e.preventDefault();
        alert("TEST WORKING");
    }));
});