Не срабатывает второй раз событие по нажатию на активный элемент. В чем может быть причина, подскажите, пожалуйста?
$('.products-grid-header li.active-items').on('click', function() {
$('.products-grid-header-item').show();
$('.products-grid-header-item').click(function() {
$('.products-grid-header li.active-items').removeClass('active-items');
$(this).addClass('active-items');
$('.products-grid-header li:not(.active-items)').each(function() {
$(this).hide();
});
});
});
.products-grid-header li:not(.active-items){
display: none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="products-grid-header">
<li class="products-grid-header-item active-items">
<a class="" href="#1">1</a>
</li>
<li class="products-grid-header-item">
<a class="" href="#2">2</a>
</li>
<li class="products-grid-header-item">
<a class="" href="#3">3</a>
</li>
<li class="products-grid-header-item">
<a class="" href="#4">4</a>
</li>
<li class="products-grid-header-item">
<a class="" href="#5">5</a>
</li>
<li class="products-grid-header-item">
<a class="" href="#6">6</a>
</li>
</ul>