how to add onclick event to dynamically added button

Question

how to add on click event for a button which is created dynamically

$("tr").html("<button class='new'><span>next-</span></button>" + OriginalContent + "")

$('body').on('click', 'button .new', function() {
  //Some 
});

but its not working

Answer 1

You need to remove between selector as space in selector indicate matching against descendants.

$("tr").on('click', 'button.new', function () {

Always use staticParentElement when using Event delegation for better performance.

Answer 2

Try this:

$(document).on('click', 'button.new', function () {});

Answer 3

Remove the space between button and .new. Otherwise you will only watch .new elements inside of button, which will never happen.

$('body').on('click', 'button.new', function () {
    // ...
});