JSFiddle - React, Tailwind, and code Playground

HTML

<div class="hide"><a>Ссылка</a></div>
 
<div class="hide"><a>Ссылка</a></div>
<div class="hide"><a>Ссылка</a></div>

<div class="hide"><a>Ссылка</a></div><br>
<div class="hidden" style="display: none;">111
1Некий текст содержащийся в данном блоке.
По умолчанию он скрыт благодаря свойству display: none;</div>
<div class="hidden" style="display: none;">222
1Некий текст содержащийся в данном блоке.
По умолчанию он скрыт благодаря свойству display: none;</div>
<div class="hidden" style="display: none;">333
1Некий текст содержащийся в данном блоке.
По умолчанию он скрыт благодаря свойству display: none;</div>
<div class="hidden" style="display: none;">444
1Некий текст содержащийся в данном блоке.
По умолчанию он скрыт благодаря свойству display: none;</div><br>

CSS

.hider{
  width:25%;
  float:left;
}
.hide{
  width:25%;
  float:left;
}

JavaScript

$(document).ready(function(){
    $(".hide").click(function(){
    var i = $(".hide").index(this);
   
        $(".hidden").not( $(".hidden").eq(i).slideToggle("slow")).slideUp("slow");
        return false;
    });
});