JSFiddle - React, Tailwind, and code Playground

HTML

<p class="show_hide">Clcik Me</p>

<div class="slidingDiv"></div>

CSS

div{
   width:200px;
    height:150px;
    background:#ccc;
    
}
p{
    cursor:pointer;
    
}

JavaScript

// click to hide    
    $('html').click(function(event){
        if($(event.target).hasClass('.slidingDiv') && $('.slidingDiv').is(':visible')){
           $('.slidingDiv').hide(); 
        } 
    });

//Toggle

    $(".slidingDiv").hide();	

    $('.show_hide').click(function(event){
		event.stopPropagation();
	$(".slidingDiv").slideToggle();
	});