JQuery - Как найти следующее вхождение элемента с определенным классом

Question

Поэтому у меня есть таблица вроде этого:

<table id="TblProduits" class="TblProduitsLayout"> 
    <thead> 
     <tbody> 
      <tr class="placeholderRow"> 
       <td> 
        <input class="PrixUnitr" type="number" /> 
       </td> 
      <tr class="placeholderRow"> 
      <tr class="placeholderRow SousTotal"> 
       <td> 
        <input class="MontnHT" type="text" disabled="disabled" min="0"/> 
       </td> 
      <tr class="placeholderRow"> 
      <tr class="placeholderRow SousTotal"> 
       <td> 
        <input class="MontnHT" type="text" disabled="disabled" min="0"> 
       </td> 
    </tbody> 
</table> 

Я хочу, чтобы изменить значение Fisrt совпадение в input с именем класса MontnHT помещена внутрь tr с именем класса SousTotal, когда значение input с именем класса PrixUnitr изменяется, так что я создал событие так:

$('body').on('change', '.PrixUnitr', function() {  
    $(this).closest('tr').nextAll("tr.SousTotal").find("input.MontnHT").val("foo"); 
}); 

Моя проблема заключается в том, что также меняет другие входы, содержащиеся внутри TR с тем же именем SousTotal, поскольку я хочу изменить только первое вхождение, что я делаю неправильно? и как это можно исправить?

Answer 1

использование .first() или .eq(0), чтобы получить первое вхождение элемента

$(this).closest('tr').nextAll("tr.SousTotal").first().find("input.MontnHT:first").val("foo"); 

или

$(this).closest('tr').nextAll("tr.SousTotal:eq(0)").find("input.MontnHT:eq(0)").val("foo");