JQuery click function call doesn't work after load more AJAX

The JQuery popup click function doesn't work after the load more function is placed. Here are the code for popup overlay code

jQuery(document).ready(function() {
//----- OPEN
jQuery('[data-popup-open]').on('click', function(e)  {
    var targeted_popup_class = jQuery(this).attr('data-popup-open');
    jQuery('[data-popup="' + targeted_popup_class + '"]').fadeIn(150);

    e.preventDefault();
});

//----- CLOSE
jQuery('[data-popup-close]').on('click', function(e)  {
    var targeted_popup_class = jQuery(this).attr('data-popup-close');
    jQuery('[data-popup="' + targeted_popup_class + '"]').fadeOut(150);

    e.preventDefault();
});

});

Here are the site i'm working in https://mypencilboxonline.com/upHonest/?q=node/93

Try click on member's name before and after the Load more. The JQuery above doesn't work after the load more. Not sure what's wrong. Any help would be appreciate. Thanks!