jQuery: attach .fancybox() to a new element passed by .load() function

Question

When I get new elements from load() function can't find the way to attach the function .fancybox (a lightbox plugin) to elements.

I've tried with .live() and .delegate(), but think .fancybox() could not be considered as custom event. I probably miss something... :(

Answer 1

You must wait until the DOM has been updated after the load. Add a one-shot timer in the success function called by load(). That should do the trick.

Answer 2

You need to trigger your fancybox after your content has loaded. Use a callback function.

$('#result').load('your/content.html', function() {
      // after load trigger your fancybox 
      alert('Load was performed.');
});

Further information: jQuery .load()