JSFiddle - React, Tailwind, and code Playground

by yeyene

HTML

<a class="link" target="div1">Click1</a>
<br />
<div id="div1" class="content">Div 1 content</div>
<a class="link" target="div2">Click2</a>
<br />
<div id="div2" class="content">Div 2 content</div>
<a class="link" target="div3">Click3</a>
<br />
<div id="div3" class="content">Div 3 content</div>

CSS

.content {
    display:none;
}

JavaScript

$(document).ready(function () {
    $('.link').on('click', function () {
        $('.content').slideUp(500);
        $('div#' + $(this).attr('target')).css({
            'height': '50%'
        }).slideDown(500);
    });
});