JSFiddle - React, Tailwind, and code Playground

HTML

<div class="accordion">
<div class="accordion-section open">
<a href="#accordion-1" class="accordion-section-title active">title here</a>
<div class="accordion-section-content active" id="accordion-1">
    
    content 1 here
    
</div>
<!--end .accordion-section-content-->
</div>

    <div class="accordion-section">
<a href="#accordion-2" class="accordion-section-title">title 2</a>
<div class="accordion-section-content" id="accordion-2">
content 2 here</div>
</div>

CSS

/*----- Accordion -----*/
    .accordion, .accordion * {
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    }
    .accordion {
    overflow:hidden;
    box-shadow:0px 1px 3px rgba(0,0,0,0.25);
    border-radius:3px;
    background:#f7f7f7;
    }
    /*----- Section Titles -----*/
    .accordion-section-title {
    width:100%;
    padding:15px;
    display:inline-block;
    border-bottom:1px solid #1a1a1a;
    background:#333;
    transition:all linear 0.15s;
    /* Type */
    font-size:1.200em;
    text-shadow:0px 1px 0px #1a1a1a;
    color:#fff;
    }
    .accordion-section-title.active, .accordion-section-title:hover {
    background:#4c4c4c;
    /* Type */
    text-decoration:none;
    }
    .accordion-section:last-child .accordion-section-title {
    border-bottom:none;
    }
    /*----- Section Content -----*/
    .accordion-section-content {
    padding:15px;
    display:none;
    }
    .accordion-section-content.active {
    display:block;
    }

JavaScript

$(document).ready(function() {
    function close_accordion_section() {
        $('.accordion .accordion-section-title').removeClass('active');
        $('.accordion .accordion-section-content').slideUp(300).removeClass('open');
    }
 
    $('.accordion-section-title').click(function(e) {
        // Grab current anchor value
        var currentAttrValue = $(this).attr('href');
 
        if($(e.target).is('.active')) {
            close_accordion_section();
        }else {
            close_accordion_section();
 
            // Add active class to section title
            $(this).addClass('active');
            // Open up the hidden content panel
            $('.accordion ' + currentAttrValue).slideDown(300).addClass('open'); 
        }
 
        e.preventDefault();
    });
});