JSFiddle - React, Tailwind, and code Playground

by kapilgopinath

HTML

<div id="wrap-categories">
    <p>Choose a category</p>
    <ul class="" style="display: none;">
        <li data-value="1">Category 1</li>
        <li data-value="2">Category 2</li>
        <li data-value="3">Category 3</li>
    </ul>
</div>

JavaScript

$('#wrap-categories').click(function() {
	event.stopPropagation();
   $('#wrap-categories > ul').addClass('opened').show();
});


$(document).click(function() {    	
    $('#wrap-categories > ul').removeClass('opened').hide();
});