Unidentified problem with jQuery's .click() function

Question

Hello all. I'm trying to add an 'onclick' function to an image with jQuery and for some reason it's not sticking. My code looks like:

//create arrow icon/button for li
var img = $('<img></ >').attr('id',i+5)
                       .attr("src","images/16-arrow-right.png")
                       .addClass("expImg")
                       .click(function(){expand(this, 'tdb', 'years', 'danwoods')})
                       .appendTo(li);

and the resulting element looks like;

<img id="6" src="images/16-arrow-right.png" class="expImg"/>

It completely leaves out the onclick function, but everything else works fine. Does anyone see a problem with my code, or does the error lie elsewhere? Thanks in advance...

Answer 1

I wouldn't expect the click event handler you're defining to show up in an HTML rendering of the element. You're really not "setting an onclick"; you're binding a function to the DOM click event, which is kind of a different thing. For starters, you can bind several such functions and they play nicely with each other.

If it's really important to you that it render, try doing:

.attr('onclick', "expand(this, 'tdb', 'years', 'danwoods')")

and see if that works for you.