fancybox v2 div click in title

Question

I have the following in fancybox 2 as per instructions:

afterLoad: function() {
    this.title = '<center><a href="js/download.php?file=' + '../' +  this.href + '">Download</a></center>';
}

Now, would it be possible to call a function from the title? Something like:

afterLoad: function() {
    this.title = '<center><div id="loadMore">Click</div></center>';
}

and

$('#loadMore').click(function(){
alert("hi ");
});

Many thanks.

Answer 1

Yes, it would be possible if you bind the click event in a delegated form.

You could use the .on() method this way:

$(document).on("click", "#loadMore", function () {
    alert("hi");
});

that will bind a click event to the selector #loadMore regardless it exists or it's added in the future (like it happens in your afterLoad callback) to the DOM.

See JSFIDDLE