JSFiddle - React, Tailwind, and code Playground

HTML

<li class="cat_parent">
  <h2 class="head par_title">Books</h2>
  <div class="content">01</div>
  <div class="content">02</div>
</li>

<li class="cat_parent">
  <div>
  
  </div><h2 class="head par_title">Magazine</h2>
  <div class="content">01</div>
  <div class="content">02</div>
  <div class="content">03</div>
  <div class="content">04</div>
  </div>
</li>

JavaScript

$('.cat_parent').find('div').hide();

$('.head').click(function(e){
      e.preventDefault();
      $(this).siblings().slideDown('slow');
      $(this).parents('.cat_parent').siblings().find('div').slideUp('slow');
   });