Показать другой DIV на нескольких элементах на клике

Question

Я работаю с портфелем (изотоп), и я хочу сделать следующим:

Когда я щелкаю по некоторым пунктам категорий фильтруются, но я хочу отметить (поместить тег на некоторых элементы) некоторые элементы с другим div. И когда я нажимаю на другую категорию, элементы будут отфильтрованы, а новые элементы будут иметь тот же div, что и предыдущий.

<ul> 
<li><a href="#" class="selected" data-filter="*">All</a></li> 
<li><a class="" href="#" data-filter=".category1">category1</a></li> 
<li><a class="" href="#" data-filter=".category2">category2</a></li> 
<li><a class="" href="#" data-filter=".category3">category3</a></li> 
<li><a class="" href="#" data-filter=".category4">category4</a></li> 
</ul> 

Каждая категория имеет несколько элементов, как этот

<figure class="portfolio-item four columns entry category1 category2 -item"> 
<div class="img-item"> 
<a href="link.html" > 
<img src="images/image.jpg" alt="" /> 
<span class="zoomex">&nbsp;</span> 
</a> 
</div> 
<figcaption> 
<h4> 
<a href="link.html">Name</a> 
</h4> 
</figcaption> 
</figure> 

, так что я хочу делать дальше - скажем, вы выберите категорию 4. Все элементы из этой категории показаны, но я хочу первые три иметь звезду (изображение звезды) на нем. Теперь предположим, что вы нажмете категорию 2, показаны предметы из второй категории, но первые три предмета из этой категории имеют звезду на нем

Answer 1

Если ваши divs постоянные, добавьте class к тому же набору элементов (то есть элементы одна и та же группа), используйте style="display:none" для всех ваших предметов изначально, когда категория выбрана, переключатель class - display:block, таким образом вы можете иметь разные предметы в разных категориях, отображаемых в вашем div.

Я предполагаю, что вы получите все элементы первого, если нет, и вы делаете Ajax вызовы, которые вы можете динамически выделить класс к результатам поиска