JSFiddle - React, Tailwind, and code Playground
HTML
<div class="side-nav">
<div class="side-nav-item">
<h3>Title 1</h3>
<div class="side-nav-block-item">content</div>
<div class="side-nav-block-item">content</div>
</div>
<div class="side-nav-item">
<h3>Title 2</h3>
<div class="side-nav-block-item">content</div>
</div>
</div>
JavaScript
$('.side-nav h3').addClass('on');
$('.side-nav h3').click(function() {
if ($(this).hasClass('on')) {
$(this).toggleClass('on');
$(this).siblings('.side-nav-block-item').slideUp('normal');
} else {
$(this).toggleClass('on');
$(this).siblings('.side-nav-block-item').slideDown('normal');
}
});