How to get the current table row without using an event handler?

Question

I have a boostrap modal along with a event handler and basically whenever the user clicks on the editLocationBtn the modal appears which its supposed to do. I was wondering if there is a way without having to use an event handler of getting the current row, so that I can update that row after the user clicks on save? I've tried removing the document on click event handler but I couldn't get the current row.

HMTL

<td><button type = button data-bs-toggle=modal class="btn btn-primary btn-sm editLocationBtn" data-bs-target=#editLocationModal></button></td>

This is the JS

$("#editLocationModal").on("show.bs.modal", function (e) {  
$(document).on('click','.editLocationBtn',function (e) {
    currentVal = ($(this).closest('tr').find('td')[0])
   
  });
})