I want to add a button in this table. I can add it with a simple code like this but I see that I need to have unique ID for each button for each time I clicked on the add button. How can I do it. Please help, thank you very much.
var btn = document.querySelector("#btn-add");
btn.addEventListener("click", function() {
var tb = document.querySelector("#tb");
var test = document.querySelector("#test");
var test2 = document.querySelector("#test2");
var r = tb.insertRow(2);
var c1 = r.insertCell(0);
var c2 = r.insertCell(1);
var c3 = r.insertCell(2);
var c4 = r.insertCell(3);
c1.innerHTML = test.value;
c2.innerHTML = test2.value;
c3.innerHTML = "<button>add</button>";
c4.innerHTML = "<button>delete</button>"
})table,
th,
td {
border: 1px solid black;
}<input type="text" id="test">
<input type="text" id="test2">
<table id="tb">
<tr>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
</table>
<button type="button" id="btn-add">add</button>