JSFiddle - React, Tailwind, and code Playground

by Jonathan Nascimento

HTML

<div>


      <div class="menu-section-title">
          Titulo <b>A</b>
      </div>

      <div class="menu-alternativo2">
          A 1
      </div>

      <div class="menu-alternativo2">
          A 2
      </div>

      <div class="menu-alternativo2">
          A 3
      </div>

      <div class="menu-alternativo2">
          A 4
      </div>

      <div class="menu-alternativo2">
          A 5
      </div>
      
      
</div>

<div>


      <div class="menu-section-title">
          Titulo <b>B</b>
      </div>

      <div class="menu-alternativo2">
          B 1
      </div>

      <div class="menu-alternativo2">
          B 2
      </div>

      <div class="menu-alternativo2">
          B 3
      </div>

      <div class="menu-alternativo2">
          B 4
      </div>

      <div class="menu-alternativo2">
          B 5
      </div>
      
      
</div>

<div>


      <div class="menu-section-title">
          Titulo <b>C</b>
      </div>

      <div class="menu-alternativo2">
          C 1
      </div>

      <div class="menu-alternativo2">
          C 2
      </div>

      <div class="menu-alternativo2">
          C 3
      </div>

      <div class="menu-alternativo2">
          C 4
      </div>

      <div class="menu-alternativo2">
          C 5
      </div>
      
      
</div>

CSS

.menu-section-title {
  
  color: red;
}

JavaScript

$(document).ready(function(){
$('.menu-alternativo2').hide();

  $('.menu-section-title').on("click", function( ) {

        var $this = $(this);			
          $this.siblings('.menu-alternativo2').slideToggle(1000);

  });
  
});