[jQuery] Adding click handlers in a loop
What I'm trying to achieve is build a table programmatically using DOM
like so:
var Html = [];
Html.push('<table> ..... ')
.....
Html.push('</table>')
Inside the table I'm adding <tr> rows using a for loop like so:
for (var index = 0; index < length; index++)
{
Html.push('<tr><td>......</td></tr>');
......
}
And inside each table cell <td> I'm adding an anchor like so:
Html.push('<a href="javascript:void(0)" id="');
Html.push(index);
Html.push('">');
Html.push("Click HERE");
dayViewHtml.push('</a>');
I want to add a JQuery click handler to every anchor inside the for
loop like so:
jQuery('#' + index).click(function() {
alert("You clicked on" + index); });
But the problem is that the click handler doesn't care if it's inside
a loop and only executes once. I tried using the "bind" JQuery method
to bind a click handler to each anchor inside the loop but also
couldn't get the code to work.
I would really appreciate it if someone helped me out given the code
above. Thanx alot for your time...