JSFiddle - React, Tailwind, and code Playground

HTML

<div class="clicker_class"><p>Click Me</p></div>
<div class="show_menu_users">Hello World</div>

CSS

.clicker_class {
    height: 100px;
    width: 100px;
    background-color: yellow;
}
.show_menu_users {
    height: 100px;
    width: 100px;
    background-color: red;
    display:none;
    position:relative;
    margin-top: 10px;
}

JavaScript

(function ($) {
    $(document).ready(function () {
        var isShowing = false;
        
        var toggleMenu = function() {
            isShowing = !isShowing; //change boolean to reflect state change
            $('.show_menu_users').toggle(isShowing); //show or hide element
        }
        
        $(document).on('click', function (e) {
            if($(e.target).is('.clicker_class') || $(".clicker_class").has(e.target).length !== 0) {
                toggleMenu();
            } else {
                isShowing = false;
                $('.show_menu_users').hide();  
            }
        });
    });
})(jQuery);