Имеется список с содержимым внутри.
Как сделать, чтобы класс для 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>