why my remove function just remove my last entry?

Question

i am new to js and programming at all i just created a table and a way to enter record via inputs and i just added a remove and edit functionality to it but it just can remove last entry in table.

function add(){

    
const name_value =document.getElementById('textname').value;
const last_value =document.getElementById('textlast').value;



const tableRow = document.createElement('tr');
const tbody = document.getElementById('tbody');

const name_td = document.createElement('td');
const last_td = document.createElement('td');
const op = document.createElement('td');

name_td.textContent = name_value;
last_td.textContent = last_value;

op.innerHTML = `
<button id="remove">remove</button>
<button id="edit">edit</button>`

tableRow.appendChild(name_td);
tableRow.appendChild(last_td);
tableRow.appendChild(op);

tbody.appendChild(tableRow)

const remove_btn = document.getElementById('remove');
const edit_btn = document.getElementById('edit');

document.getElementById('remove').onclick = function(e){
    
    const record = e.srcElement.parentNode.parentNode;// td

    console.log(    document.getElementsByClassName('.table')
)

}

}

i dont know what is diffrence of paretnNode and ParentElement

i did both