JSFiddle - React, Tailwind, and code Playground

by oceog

HTML

<ul id="topics">
    <li>topic1</li>
    <li>topic2</li>
    <li>topic3</li>
    <li>topic4</li>
    <li class="show_others">show</li>
    <li>topic5</li>
    <li>topic6</li>
    <li>topic7</li>
    <li>topic8</li>
</ul>

CSS

#topics li.show_others ~ li {
    display: none;
}
#topics li.show_others.active ~ li {
    display: list-item;
}

JavaScript

$('#topics li.show_others').click(function() {
    $(this).toggleClass('active');
});