JSFiddle - React, Tailwind, and code Playground

HTML

<div class="col features">
        <h3>Un</h3>
        <div>
            <p>content 1</p>
            <p>content 1.2</p>
        </div>
        
        <h3>Deux</h3>
        <div>
            <p>content 2</p>
        </div>
        
        <h3>Troix</h3>
        <div>
            <p>content 3</p>
            <p>content 3.1</p>
        </div>
        
        <h3>Quatre</h3>
        <div>
            <p>content 4</p>
        </div>
    </div>

CSS

.features h3{color: #004B91;margin-bottom:5px;padding-left:20px;}
.features h3:hover{text-decoration:underline;cursor:pointer;}
.features h3.expand  {background: url("http://www2.ademe.fr/wimages/expand.gif") no-repeat left 3px;}
.features h3.collapse{background: url("http://www2.ademe.fr/wimages/collapse.gif") no-repeat left 3px;}
.features div{background:whiteSmoke;border:1px solid #E5E5E5;padding: 8px;margin-left:20px;width:100px;}

JavaScript

$(document).ready(function() {

// Masque tout les div par défaut
$(".features div").hide(); 
    
// Ajoute la class expand aux balises H3
$(".features h3").addClass("expand"); 
        
$(".features h3").click(function() {             
        
    // Si il y'a un div ouvert, on le referme
    $(".features div").slideUp(10);    
    
    // Ouvre le div suivant la balise H3
    $(this).next(".features div").toggle(); 
        
    // Vérifie l'état des div et applique la class correspondante
    $(this).next(".features div").is(':hidden') ? $(this).removeClass("collapse").addClass("expand") : $(this).removeClass("expand").addClass("collapse");    
    });        
});