JSFiddle - React, Tailwind, and code Playground
HTML
<div id="widgetbodycontainer" >
<div class="layer1">
<p class="h">Company </p>
<div class="c">
<input value="test"/>
</div>
<p class="h">adf</p>
<div class="c">
<input value="test"/>
</div>
<p class="h">Result</p>
<div class="c">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
</div>
JavaScript
$(".c").hide();
jQuery("#widgetbodycontainer").click(function(e) {
console.log("clicked");
// if user clicks on a .c element or a descendant of one
if (jQuery(e.target).hasClass("h") || jQuery(e.target).parents(".h").length) {
jQuery(e.target).next(".c").slideToggle(200);
}
});