JSFiddle - React, Tailwind, and code Playground
HTML
<div id="fil">
<button rel="all">Все</button>
<button rel="1">1</button>
<button rel="2">2</button>
<button rel="3">3</button>
<button rel="4">4</button>
<button rel="5">5</button>
</div>
<div class="viborka all 1">выборка</div>
<div class="viborka all 1">выборка</div>
<div class="viborka all 1">выборка</div>
<div class="viborka all 1">выборка</div>
<div class="viborka all 1">выборка</div>
<div class="viborka all 2">выборка</div>
<div class="viborka all 2">выборка</div>
<div class="viborka all 2">выборка</div>
<div class="viborka all 2">выборка</div>
<div class="viborka all 2">выборка</div>
<div class="viborka all 3">выборка</div>
<div class="viborka all 3">выборка</div>
<div class="viborka all 3">выборка</div>
<div class="viborka all 3">выборка</div>
<div class="viborka all 3">выборка</div>
<div class="viborka all 3">выборка</div>
<div class="viborka all 3">выборка</div><div class="viborka all 3">выборка</div>
<div class="viborka all 4">выборка</div>
<div class="viborka all 4">выборка</div>
<div class="viborka all 4">выборка</div>
<div class="viborka all 4">выборка</div>
<div class="viborka all 4">выборка</div>
<div class="viborka all 5">выборка</div>
<div class="viborka all 5">выборка</div>
<div class="viborka all 5">выборка</div>
<div class="viborka all 5">выборка</div>
<div class="viborka all 5">выборка</div>
<div class="viborka all 5">выборка</div>
JavaScript
/* Фильтр */
$(function() {
var newSelection = "";
$("#fil button").click(function(){
$("#fil button").removeClass("active");
$(this).addClass("active");
newSelection = $(this).attr("rel");
$(".viborka").not("."+newSelection).slideUp();
$("."+newSelection).slideDown();
});
});