Creating elements using a loop in JS.

[montyonthebonty]

I'm using AJAX to retrieve data from a MySQL Database and create a table. In the end column of the table, I want a series of buttons, to carry out different actions for that record (the same actions, using the same set of functions, just with a different record).

What I've tried is:

for (var line of liveFeedJSON) {

  //Create <tr> and <tds>

  tscButton = document.createElement('button');
  tscButton.innerHTML = '<span class="fa-solid fa-keyboard">';
  tscButton.className = 'actionButton';
  tscButton.onclick = function() {checkAction(this, currentUser, line['svcID'], 'shtTSC', 'System updated.');};

  functionsCell.appendChild(tscButton);
}

The trouble is, it seems to pass the arguments from the last line created, whichever button is clicked on and I can't work out how to get round this. Any ideas would be very welcome!

Thanks
Chris