JSFiddle - React, Tailwind, and code Playground

HTML

<div class="A"><div class="inf">1</div></div>
<div class="A"><div class="inf">2</div></div>
<div class="A"><div class="inf">3</div></div>
<div class="A"><div class="inf">4</div></div>

CSS

.A, .inf {
    min-height: 20px;
    min-width: 80px;
    padding: 10px;
}

.A {
    background: #ccc;
    margin-bottom: 15px;
    cursor: pointer;
}

.inf {
    color: #fff;
    display: none;
    background: #555;
}

JavaScript

$('.A').bind('click', function() {
    var inf = $('.inf', jQuery(this));
    if (inf.is(":visible"))
    {
        inf.hide();
    }
    else
    {
        $('.inf').hide();
        inf.show()
    }
});