Как правильно добавить класс на JS по клику, если классы-триггеры дублируются?

Question

Имеется список с содержимым внутри.
Как сделать, чтобы класс для ul.hide-me добавлялся при клике на .parent-lm-a, при этом чтобы это не влияло на аналогичные элементы ниже/выше.

Обобщая: как сделать, чтобы при нажатии на ссылку задавался класс только одному ul, а не всем сразу?

 
 $('.parent-div > a').on('click',function(){
    $('.hide-me').toggleClass('show-subchildren');
 });

.show-subchildren {
  background: red !important;
}

<ul class="parent-ul">
     <li class="first-include">
      <div class="parent-div">
         <a href="#" class="parent-lm-a">Добавить класс по клику только для ul, который ниже меня</a>
         <ul class="hide-me"><li>111</li></ul>
      </div>
     <li>
     <li class="first-include">
      <div class="parent-div">
         <a href="#" class="parent-lm-a">Добавить класс по клику только для ul, который ниже меня</a>
         <ul class="hide-me"><li>111</li></ul>
      </div>
     <li>
    </ul>
    
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Answer 1

$(this).closest('.parent-div').find('.hide-me').toggleClass('show-subchildren');

БЛОГ НА HUSL

Как правильно добавить класс на JS по клику, если классы-триггеры дублируются?

Ответы (1 шт):