Question

I have a list of links that are being created dynamically by another function they are in the form <a id="hi-1">test</a> <a id="hi-2">test</a> etc.

I am trying to target these links and bind click/mouseover events to them. The following is the code for targeting one of these link(#hi-1):

$(function() {

    $("#hi-1") .bind("mouseover", highlight);
    $("#hi-1") .bind("mouseleave", highlight);
            $("#hi-1") .bind("click", highlight);

    });
    function highlight(evt){
    $("p#p-1").toggleClass("highlighted");
    }

This should toggle the class name of .

I can’t seem to get it to work, I believe it could be something to do with the fact that the links are created dynamically. However i have little jQuery experience and i may be going about it the wrong way.

Any Help is much appreciated.

Answer 1

Try

$("#hi-1").live("mouseover mouseleave click", function(){
    $("p#p-1").toggleClass("highlighted");
});