Question

I have some code which adds a tooltip to all links. Now, the page keep changing with AJAX – how can I track these changes and add tooltips to links which are added to the document by AJAX?

I thought this might work:

$(document).live('change', function(){

    //code...

});

But I’m guessing there’s a smarter/more efficient method to work this out. Any ideas?

Note: I can only use jQuery 1.3.2

Answer 1

You’re close, but I think you might be misunderstanding the .live() function.

What .live() does is establish the monitoring for you – it looks at the DOM changes in the page and decides if new elements that match the selector have shown up. If they have, then it attaches the specified function to them.

Try something like this:

$("a").live('mouseover', function(){

    //code...

});

What this does is start monitoring the DOM for any <a> elements that get added to it, and when a new element is detected, it attaches the function to the mouseover event for that element.