JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://s3.amazonaws.com/filter.js/filter.js"></script>
<nav>
    <a href="#" data-filter="green">Green</a>
    <a href="#" data-filter="blue">Blue</a>
    <a href="#" data-filter="red">Red</a>
    <a href="#" data-filter="yellow">Yellow</a>
</nav>
<section id="filter">
    <div class="block" style="background: green" data-filter-tags="green"></div>
    <div class="block" style="background: blue" data-filter-tags="blue"></div>
    <div class="block" style="background: red" data-filter-tags="red"></div>
    <div class="block" style="background: yellow" data-filter-tags="yellow"></div>
    <div class="block" style="background: orange" data-filter-tags="yellow,red"></div>
    <div class="block" style="background: purple" data-filter-tags="blue,red"></div>
    <div class="block" style="background: cyan" data-filter-tags="blue,green"></div>
    <div class="block" style="background: black" data-filter-tags="green,blue,red,yellow"></div>
    <div class="block" style="background: magenta" data-filter-tags="red,blue"></div>
</section>

CSS

body {
    font-family: sans-serif;
    text-align: center;
}
nav {
    background: #eee;
    padding: 10px 0;
    margin: 0 0 20px;
}
nav a {
    background: #ccc;
    padding: 5px;
    display: inline-block;
    text-decoration: none;
    color: black;
}
nav a.selected {
    background: white;
}
.block {
    width: 100px;
    height: 100px;
    margin: 10px;
    display: inline-block;
}

JavaScript

$('#filter').filter({
		showAny: true
});