JSFiddle - React, Tailwind, and code Playground
HTML
<button id="button0">Add Element</button>
<div id="from-static"><h3>dynamic buttons</h3></div>
<div id="from-dynamic"><h3>dynamic buttons</h3></div>
CSS
#from-static, #from-dynamic{
margin-top: 40px;
}
JavaScript
element_number = 1;
$('#button0').on('click', function(){
$('#from-static').append(
'<button id=' + element_number + ' class="btn" >' + 'Element #' + element_number + '</button> <br/>'
);
element_number = element_number + 1;
});
// function to handle dynamically generated buttons
$(document).on('click','.btn', function(){
var currentId = $(this).attr('id');
$('#from-dynamic').append(
'<button id=' + element_number + ' >' + 'Element #' + element_number + ' Generated by: ' + currentId + '</button> <br/>'
);
element_number = element_number + 1;
});