Найти следующий элемент в JQuery

Question

У меня есть некоторые HTML, как это:

<div class="form-group"> 
    <input type="text" class="sequence valid"> 
</div> 

<div class="form-group"> 
    <input type="text" class="sequence valid"> 
</div> 

<div class="someclass1"> 
    <div class="someclass2"> 
     <div class="form-group"> 
      <input type="text" class="sequence valid"> 
     </div> 

     <div class="form-group"> 
      <input type="text" class="sequence valid"> 
     </div> 
    </div> 
</div> 

<div class="form-group"> 
    <input type="text" class="sequence valid"> 
</div> 

<div class="someclass1"> 
    <div class="someclass2"> 
     <div class="form-group"> 
      <input type="text" class="sequence valid"> 
     </div> 
    </div> 
</div> 

Используя это то, что мне нужно, чтобы найти следующий элемент, который содержит .sequence жгутов в form-group.

Это, как я попробовал его в JQuery:

var $element = $(event.target); 
    if ($element.hasClass('valid')) { 
     $element.closest('.form-group') 
      .next('.form-group') 
      .find('.sequence') 

    } 

Но его не выбирать элементы в пределах этого блока кода:

<div class="someclass1"> 
    <div class="someclass2"> 
     <div class="form-group"> 
      <input type="text" class="sequence valid"> 
     </div> 
    </div> 
</div> 

Может кто-нибудь сказать мне, как я могу изменить это JQuery для соответствуют моему требованию. Спасибо.

Answer 1

Проблема ваша .next('.form-group') является нахождение целевого элемента в качестве someclass1 элемента не соответствует Селектор

$element.closest('.form-group') 
    .next('.form-group, :has(.form-group)') 
    .find('.sequence') 

или вы можете опустить селектор в next и найти .sequence элемент в следующем родственный элемент

$element.closest('.form-group') 
    .next() 
    .find('.sequence')