I am just creating simple example of jQuery events for dynamic elements. I am unable to execute the click handler. Anything I am doing wrong here?
$(document).ready(() => {
$('#addTrip').click(addATrip);
$('table#myTrips tr td button').click(function(evt) {
alert($(evt.currentTarget).attr('list-item'));
})
$('table#myTrips tr td button').on('click', function(evt) {
alert($(evt.currentTarget).attr('list-item'));
});
});
var listItem = 7;
function addATrip() {
listItem++;
$('#myTrips tbody').append(`
<tr>
<td>
<button list-item="${listItem}">Click Mee</button>
</td>
</tr>
`)
}
HTML Code
<table id="myTrips">
<tr>
<td>
<button list-item="5">Click Mee</button>
</td>
</tr>
<tr>
<td>
<button list-item="6">Click Mee</button>
</td>
</tr>
<tr>
<td>
<button list-item="7">Click Mee</button>
</td>
</tr>
</table>
<button id="addTrip">Add Trip</button>
Appreciate your help.
Thank you, Ankit