javascript - Button created with jQuery/JS, don't react to click

I'm trying create a list of Messages a user can type in an textarea on the site and delete any of them using a button he automatically creates with each message.
My idea is that I create a div in which I first put the message of the user in and then prepend the button with the same ID of the div; This way I call the ID of the button and remove all elements with the same ID.

It perfectly lists the elements in the #textfield
I added a button directly in my HTML code which deletes certain divs, as well as itself using the code above. This is why I know that the Problem is that the created Buttons at (-----1-----) don't react to the command in (-----2-----)

I already tried to create an Input of type button and put a .click function instead of .on("click", [...]).

Answer

$(document).on('click', '#buttonid', function() {


});

Use event delegation on dynamically created elements

DOCUMENTATION