JSFiddle - React, Tailwind, and code Playground

by Nick Craver

HTML

<div id="wrapper">
    <h2>header1</h2>
     <p>paragraph1</p>
    <h2>header2</h2>
     <p>paragraph2</p>
    <h2>header3</h2>
     <p>paragraph3</p>
 </div>

CSS

.active{
    background:red;
}

JavaScript

$(document).ready(function() {
   $('#wrapper > p').hide();
   $('#wrapper > h2').click(function() {
   $(this).next('p').slideToggle('fast').siblings('p:visible').slideUp('fast');
   $(this).toggleClass("active").siblings().removeClass("active");
   });
  });