Есть два списка. При клике по одному из элементов в одном списке ему присваивается класс, а у других удаляется.
Как сделать, чтобы в соседнем списке, у соответствующего элемента тоже прикреплялся и удалялся этот класс. То есть, если в первом списке у (третьего например) элемента есть класс .active
, то и и в другом у этого же элемента он появлялся. желательно чтобы проверка шла в обе стороны.
Ниже написал пример небольшого кода, только пока не понял как связать...
$(".sliderone li").click(function() {
$(".sliderone li").removeClass("active");
$(this).addClass("active");
if($(".sliderone li:eq("+el+")").hasClass('active')){
$(".muther .child:eq("+el+")").addClass('active')
}
})
li.active,
.child.active {
background: #95FFCC;
padding: 5px;
border: 2px solid #2C9A00;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<ul class="sliderone">
<li>1</li>
<li class="active">2</li>
<li>3</li>
</ul>
<div class="nextclock">
<div class="muther">
<div class="child">11</div>
<div class="child">22</div>
<div class="child">33</div>
</div>
</div>
Обратите внимание, что у одного из элементов этот класс уже стоит, то есть проверка наличия класса должна срабатывать не по клику, а сразу, независимо от того, кликнули или нет. Не ругайте за ошибки, просто пробую не знаю пока, как.