isotope html
<!-- click option -->
<div class="button-group filter-button-group">
<button data-filter="*">show all</button>
<button data-filter=".metal">metal</button>
<button data-filter=".transition">transition</button>
<button data-filter=".alkali, .alkaline-earth">alkali & alkaline-earth</button>
<button data-filter=":not(.transition)">not transition</button>
<button data-filter=".metal:not(.transition)">metal but not transition</button>
</div>
<!-- show option -->
<div class="grid">
<div class="element-item transition metal">...</div>
<div class="element-item post-transition metal">...</div>
<div class="element-item alkali metal">...</div>
<div class="element-item transition metal">...</div>
<div class="element-item lanthanoid metal inner-transition">...</div>
<div class="element-item halogen nonmetal">...</div>
<div class="element-item alkaline-earth metal">...</div>
</div>