セレクタなしで動的に作成されたボタンにクリックイベントをバインドする

Question

javascriptとjQueryを使用して動的に要素を作成しようとしています。現在、私は単純なクリックイベントを動的に作成されたボタン要素にバインドすることに固執しています。

ボタンが

var theButton = $("<button>...</button>"); 

を使用して作成された今、私は、クリックイベントをバインドしたいので、私は

theButton.on("click", function(){...}); // which is not working 

他のソリューションを追加しましたが、それはコンテナにバインドしなければならないことを、指摘しました。だから問題は、この時点ではjQueryオブジェクトであるセレクタ（on方法の第2 PARAM）である

$(document).on("click", theButton, function(){...}); // this fires no matter where I click 

になってしまいました。

はまた

Answer 1

はこれを試してみてください動作していない

theButton[0].onclick =() => alert("Clicked") 

を試してみました。それは

$(function(){ 
    var theButton = $("<button>button</button>"); 
    theButton.click(function(){ 
     alert('clicked'); 
    }) 
    $('body').append(theButton); 
}) 

Working fiddle

を働いています