Jquery Click event of <a> tag added at run time doesn't get fired.

Question

I am adding tag at run time using jquery.

<a id=add class=add href=#>Test</a>

I want to fire the click event of this tag but it doesn't get fired.

I have already tried

$('#add').bind('click', function(e) {

e.preventDefault();
  alert('hello');

});

but nothing happens.

Answer 1

You need to bind it using .live()

$('#add').live('click', function(e) {
  e.preventDefault();
  alert('hello');
});

The .live() method is able to affect elements that have not yet been added to the DOM through the use of event delegation.

http://api.jquery.com/live/

Answer 2

Maybe you should use a valid XHTML:

<a id="add" class="add" href="#">Test</a>

And in the jQuery:

$('#add').live('click', function(e) {
    e.preventDefault();
    alert('hello');
});