JSFiddle - React, Tailwind, and code Playground
HTML
<div>
<table border=1>
<thead>
<tr>
<td>Item head1</td>
<td>Item head2</td>
<td>Item head3</td>
</tr>
</thead>
<tbody id="tableId">
<tr>
<td>Item one1</td>
<td>Item one2</td>
<td>Item one3</td>
</tr>
<tr>
<td>Item two1</td>
<td>Item two2</td>
<td>Item two3</td>
</tr>
<tr>
<td>Item three1</td>
<td>Item three2</td>
<td>Item three3</td>
</tr>
</tbody>
</table>
</div>
JavaScript
function addRowHandlers() {
var table = document.getElementById("tableId");
var rows = table.getElementsByTagName("tr");
for (i = 0; i < rows.length; i++) {
var currentRow = table.rows[i];
var createClickHandler =
function(row) {
return function() {
var cell = row.getElementsByTagName("td")[0];
var id = cell.innerHTML;
alert("id:" + id);
};
};
currentRow.onclick = createClickHandler(currentRow);
}
}
window.onload = addRowHandlers();