I am creating a unique button dynamically for each row in a table to handle deletions. I am assigning the id of the button with the key of the row, allowing me to retrieve it later when clicked. Since all buttons share the same function, passing the specific button that was clicked to the event handler is necessary in order to identify which one needs to be deleted.
When hardcoding, I typically pass 'this' to the event handler. How can I achieve this same functionality when generating dynamic buttons?
At the moment, my code looks like this:
{
var cell0 = row.insertCell(0);
var btn = document.createElement("input");
btn.type = "button";
btn.id = "btnHistorySelect_" + roundHdr[i].id; // appending the id to the name allows us to reference it when the select button is clicked, thus indicating the current round to select
btn.value = "Set Current";
btn.onclick = btnHistorySelect;
cell0.appendChild(btn);
}
function btnHistorySelect() {
}
The event handler is being triggered, but there is no way to determine which specific button initiated the click event.