I'm fetching some data using JSON. According to data the HTML table is created. Each item has button. When I click on specific button I want to show alert window with button ID.
This is how I'm fetching data and populating HTML table:
function updateStations(){
$.ajax({
url: "scanstations.php",
type: 'POST',
cache: false,
success: function (data){
var jsonData = JSON.parse(data);
var tabledata;
for (var i = 0; i < jsonData.stations.length; i++){
tabledata += '<tr styls="padding-top:4px"><td>' + jsonData.stations[i].ID + '</td><td>' + jsonData.stations[i].IP + '</td><td><button class="btn btn-primary margin-top-5px" ';
tabledata += ' id="' + jsonData.stations[i].IP + '"> <span >ButtonTitle</span></button></td></tr>';
}
console.log(jsonData);
$('#listOfStations').html(tabledata);
}
})
}
How to create event for buttons?
I had tried on this way:
$(document).ready(function () {
$('.btn-primary').on('click', () =>{
alert($(this).attr("id"));
}); });
But doesn't work.