JSFiddle - React, Tailwind, and code Playground

HTML

<select id="sort_option">
    <option value="">All</option>
    <option value="chat">Chat</option>
    <option value="note">Notes</option>
    <option value="share">Files</option>
    <option value="entered">Participants</option>
</select>
<ul class="options">
    <li class="chat">1</li>
    <li class="note">2</li>
    <li class="entered">3</li>
    <li class="chat">4</li>
    <li class="entered">5</li>
    <li class="share">6</li>
    <li class="note">7</li>
</ul>

JavaScript

$(document).ready(function () {
    $('#sort_option').on('change', function () {
        var clas = $(this).val();
        $('.options').children().each(function () {
            if ($(this).attr('class') == clas) {
                $(this).show();
            } else if (clas == '') {
                $(this).show();
            } else {
                $(this).hide();
            }
        });
    });
});