Bindung an click-event zu dynamisch erstellte Schaltfläche ohne Selektor

Question

Ich versuche, Elemente dynamisch mit JavaScript und jQuery zu erstellen. Momentan bin ich dabei, ein einfaches click-event an ein dynamisch erzeugtes Button-Element zu binden.

Die Schaltfläche wird erstellt mit

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

Jetzt möchte ich das Click-Ereignis binden, so dass ich hinzugefügt

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

Andere Lösungen wies darauf hin, dass es in einen Behälter gebunden werden müssen. So landete ich mit

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

Das Problem ist der Selektor (2. param der on Methode), die ein jQuery-Objekt an diesem Punkt ist.

versuchte auch

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

die auch nicht

funktioniert

Answer 1

bereits. Es funktioniert

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

Working fiddle