JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css">
     <div id="happenings">
        <h3>Clicky<span class="ui-icon ui-icon-circle-triangle-e"></span></h3>
         <span class="ui-helper-hidden" id="clicky-1"><div class="more"> yadada</div></span>
        <h3>Clicky<span class="ui-icon ui-icon-circle-triangle-e"></span></h3>
            <span class="ui-helper-hidden" id="clicky-2">THINGS</span>
                 <h3>Clicky<span class="ui-icon ui-icon-circle-triangle-e"></span></h3>
            <span class="ui-helper-hidden" id="clicky-3">THINGS</span>
    </div>

CSS

.ui-icon {display:inline-block;}

JavaScript

$('#happenings>h3').click(function() {
       
       $(this).next('span').fadeToggle()
        $('span', this).toggleClass('ui-icon-circle-triangle-s'); 
    });