Hello everyone, please tell me how can I link td to th?

Question

For example, I drag columns(the rows are not filled in yet), add data using input, and the entered data does not match the column. How can I fix this?
<thead id="thead">
<tr id="columns">
<th>№</th> <th>full name</th> <th>date birth</th> <th>salary</th> <th>delete</th>
</tr>
</thead>

document.getElementById("thead").appendChild(rowHead);
document.getElementById("add").onclick = function() {
let number = document.getElementById('number').value
let FIO = document.getElementById('FIO').value
let date = document.getElementById('date').value
let salary = document.getElementById('salary').value
if (number != "" && FIO != "" && date != "" && salary != "") {
let row = document.createElement("tr");

row.innerHTML = `<td contenteditable>${number}</td> <td contenteditable>${FIO}</td> <td contenteditable>${date}</td> <td contenteditable>${salary}</td> <td class="close">❌</td>`;
document.getElementById("node").appendChild(row);

Answer 1

The table details TD should be inside the Table head TH tag