Bind Magnific Popup to elements loaded to the page via Ajax

I've got a page showing shopping type results similar to the results on this page:
http://preview.themeforest.net/item/canvas-the-multipurpose-html5-template/full_screen_preview/9228123?_ga=2.20215992.1090204806.1520297971-651757903.1516138265

I'm having issues with the quick view feature, because I'm loading the shopping page results via ajax, and I believe the event listeners fire on page load.

I found a similar issue reported directly to Magnific Popup, and their response was to trigger the binding again after the results load via Ajax. Their response can be found here:
https://github.com/dimsemenov/Magnific-Popup/issues/985

I've tried calling $(this).magnificPopup(); after success of the ajax call, and I don't get any errors, but the magnific popup still does not work.
$.ajax({
type: "GET",
url: url,
dataType: 'html',
success: function(data){
//console.log(data);
var htmlData = "";
$('#portfoliowrapper').html(data);
//console.log(this);
$(this).magnificPopup();
},
error: function(data) {
alert("Error in ajax call.");
}
});
I'm taken to the href of the quick view when I click on quick view rather than seeing the data in a popup.

Any thoughts on how I can bind Magnific Popup after loading data via Ajax?

Thanks

In case anyone else runs into this issue, I was able to correct my problem by calling a function to bind Magnific Popup to the Ajax items after loading the items to the page. You can use this function to achieve this for elements with a data-lightbox attribute = ajax. It can be modified for other supported attributes as well. Hope it helps.

		function lightboxreinitialize(){
			if( !$().magnificPopup ) {
				console.log('lightbox: Magnific Popup not Defined.');
				return true;
			}
				
			$('[data-lightbox="ajax"]').magnificPopup({
				type: 'ajax',
				closeBtnInside: false
			});
		}