JSFiddle - React, Tailwind, and code Playground

HTML

<div id="divouter">
  outer
  <div id="divinner">
    inner
  </div>
</div>

CSS

#divouter {
  background-color: red;
  height: 45vh;
  width: 75vh
}

#divinner {
  background-color: blue;
  height: 25vh;
}

JavaScript

var blueclick = document.getElementById('divinner');
blueclick.onclick = function(event) {
  alert('blue');
  event.preventDefault();

}

var redclick = document.getElementById('divouter');
redclick.onclick = function() {
  //alert('red');
  redclick.style.visibility = 'hidden';
}

redclick.onfocusout = function() {
  alert('red focus out');
}