How can I access a cell in a row of a table in js using parent

I have a javascript where upon click of a button a row with two cells is added to the table. One cell has a livesearch textfield and the another cell has a quantity textfield, whose value suppose to dynamically change and/or determined upon click on the livesearch textfiled results.

I have tried somethin but the challenge I am facing is that the value of the dynamically determined textfield of previous rows keep changing to the value of the cell of the latest row textfiled.

So I am seeking for assistance on how to clean-up the script so that each row will respond according to its respective values in the livesearch textfield

$(document).ready(function() {
  $(document).on('click', '.btnaddstockTransfer', function() {
    var html = '';
    html += '<tr>';
    html += '<td><div class="search-box"><input id="stock" class="form-control is-warning stock" type="text" name="stock[]" placeholder="Search by name or code"><div class="result"></div></div></td>';
    html += '<td><input class="form-control is-warning eqty" type="text" name="stockeqty[]" readonly size="2"></td>';
    html += '</tr>';

    $('#stockTransfer').append(html);


    $(document).on('keyup input', '.search-box input[type="text"]', function() {
      /* Get input value on change */
      var inputVal = $(this).val();
      var resultDropdown = $(this).siblings(".result");
      if (inputVal.length) {
        $.get("backend-search.php", {
          term: inputVal
        }).done(function(data) {
          // Display the returned data in browser
          resultDropdown.html(data);
        });
      } else {
        resultDropdown.empty();
      }
    });

    // Set search input value on click of result item
    $(document).on("click", ".result p", function() {

      var stock = $(this).text();

      $(this).parents(".search-box").find('.stock').val(stock);
      $(this).parent(".result").empty();

      var tr = $(this).parent(".search-box").parent().parent().parent();

      $.ajax({
        method: "get",
        url: "saleqtyOnFly.php",
        data: {
          item: stock
        },
        success: function(data) {
          tr.find(".eqty").val(data);
        }
      })

    });
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<div style="overflow-x:auto">
  <table id="stockTransfer" class="table">
    <thead>
      <tr>
        <th style="color:blue">Search Product's(Name/Code)</th>
        <th style="color:blue">instore Availability</th>
        <th style="color:blue">Price/Unit</th>
        <th style="color:blue">Choose Selling Unit(eg:cartons/etc)</th>
        <th style="color:blue">Quantity</th>
        <th style="color:blue">Cummulative Price</th>
        <th style="color:blue"> Delete </th>
      </tr>
    </thead>
    <tbody>
      <tr>
      </tr>
    </tbody>
  </table>
</div>