Search code examples
jqueryajaxloaddhtml

loading HTML fragments with jQuery

I'm very new to jQuery, Ajax and things like these. I've found solutions on how to inject HTML fragments into my site:

 $(document).ready(function(){  
     $('a').click(openContent); //binding all anchors to this function
 });

function openContent(){ 
 var path = $(this).attr('href');
 $('#content').load(path); 

 return false; //to prevent browser from loading the single HTML fragment
}

That works really fine! The problem is, these function won't be executed when clicking on anchors located in the new HTML fragment which were injected right before. So the fragment won't get injected into div, the browser will only load the fragment for itself.

Hope there are solutions which aren't that tricky... thanks


UPDATE:
Ok, live does a good job BUT,

there are also pictures connected to the jQuery lightbox plugin (balupton-edition) with rel="lightbox-tour" in these fragments. They are displayed in new window instead of the lightbox-div. Any suggestions?

Solution

  • use live, that will bind it to every anchor that gets added:

    $('a').live('click',openContent);