JSFiddle - React, Tailwind, and code Playground

HTML

<a href="#" id="tituloMenu1">
    <p>Menu Um</p>
</a>

<div id="menu1" style="display:none;">
    <ul>
        <li>Item Um</li>
        <li>Item Dois</li>
        <li>Item Três</li>
    </ul>
</div>
<a href="#" id="tituloMenu2">
    <p>Menu Dois</p>
</a>

<div id="menu2" style="display:none;">
    <ul>
        <li>Item Um</li>
        <li>Item Dois</li>
        <li>Item Três</li>
    </ul>
</div>

JavaScript

$('[id^=tituloMenu]').on('click', toggle_visibility);

function toggle_visibility(e) {
    e.preventDefault(); //por precaução
    var idDestino = this.id.split('tituloMenu')[1];
    var visivel = $('#menu' + idDestino).is(':visible');
    $('[id^=menu]').hide();
    $('#menu' + idDestino).toggle(!visivel);
}