Есть вот такая верстка
<li class="header-catalog__item_sub">
<span class="header-catalog__arrow"></span>
</li>
<div class="header-catalog__sub"></div>
<li class="header-catalog__item_sub">
<span class="header-catalog__arrow"></span>
</li>
<div class="header-catalog__sub"></div>
Мне нужно что бы по клику "header-catalog__arrow" добавить класс "active" для блока котрый идет сразу после li т.е "header-catalog__sub"
что бы было примерно так
<li class="header-catalog__item_sub">
<span class="header-catalog__arrow">1 тут нажал</span>
</li>
<div class="header-catalog__sub">1 этому блоку добавил класс active</div>
<li class="header-catalog__item_sub">
<span class="header-catalog__arrow">2 тут нажал</span>
</li>
<div class="header-catalog__sub">2 этому блоку добавил класс active</div>