JSFiddle - React, Tailwind, and code Playground

by Alex Incarnati

HTML

<div class="opacityZero">
<button >I am invisible</button>
</div><span>↑ Click above (Opacity:0 - children clickable</span>
 
<div class="visibilityHidden">
<button>I am invisible</button>
</div><span>↑ Click above (Visibility hidden - children not clickable</span>

CSS

.opacityZero {
  opacity:0; 
}

.visibilityHidden {
  visibility:hidden;
  margin-top:20px;
}

JavaScript

$(".opacityZero, .visibilityHidden").click(function() {
  alert("Invisible is clicked");
});