JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrap">
<div class="t1">
    head 1
</div>
    <div class="t2">
        hi
    </div>
</div>
<div class="wrap">
<div class="t1">
    head 2
</div>
    <div class="t2">
        hi2
    </div>
</div>
<div class="wrap">
<div class="t1">
    head 3
</div>
    <div class="t2">
        hi3
    </div>
</div>

CSS

.t1{
    height:20px;
    width:200px;
    background-color:pink;
}
.t2{
    height:40px;
    width:200px;
    background-color:yellow;
}

JavaScript

$(".t2").hide();
$(".t1").click(function(){
$(this).next(".t2").toggle();
});