Wiz
Wiz

Reputation: 307

Binding event to dynamically added elements to DOM using jQuery

I'm dynamically adding few elements to DOM. And I want to manipulate these element behavior using .on() function of jQuery. But somehow DOM is not firing .on() event for dynamically added elements.

Here is JS Fiddle that shows the example - http://jsfiddle.net/jYQ2D/1/

When I click on "Dynamically Added in HTML" button, it should show alert message but it is not showing.

Any idea why?

Upvotes: 4

Views: 2463

Answers (1)

Explosion Pills
Explosion Pills

Reputation: 191729

Delegation via .on doesn't work that way. You have to call .on on the element and then use the second argument as the delegation selector:

$(document).on("click", "#dyna", function() { 

http://jsfiddle.net/jYQ2D/2/

Documentation. Also be aware that there can be only one #dyna element.

Upvotes: 11

Related Questions