动态添加新的div但是click事件不适用于新的div

Question

我试图制作一个按钮，这样当我点击它时它会在它之后创建一个新按钮然后当我点击下一个/新按钮时它会自动创建一个按钮但是click事件只适用于第一个按钮你能帮忙吗？

这是我的小提琴= http://jsfiddle.net/hyeFB/

// $(document).ready(function () {


    var myDiv = '<div class="myButton">myButton</div>';


     $('#c').append(myDiv);


     $('.myButton').click(function () {

         $(this).after(myDiv);

     });


 //});​

Answer 1

尝试使用on

var myDiv = '<div class="myButton">myButton</div>';

 $('#c').append(myDiv);

 $('body').on('click', '.myButton',function () {
     $(this).after(myDiv);
 });

Answer 2

// $(document).ready(function () {


    var myDiv = '<div class="myButton">myButton</div>';


     $('#c').append(myDiv);


     $('.myButton').live(function () {

         $(this).after(myDiv);

     });

   // Or Use delegation
  $('body').delegate('.myButton','click',function () {

         $(this).after(myDiv);

     });


 //});

会做的伎俩。 http://api.jquery.com/live/了解更多信息。

请注意，从jquery 1.7开始不推荐使用live，所以上面的答案是更正确的1.7 +