JSFiddle - React, Tailwind, and code Playground

HTML

<div class="a"></div>
<div class="b"></div>
<div class="c"></div>

CSS

.a, .b, .c {
  position: absolute;
  height: 100px;
  width: 100px;
  border: 1px #000 solid
}
.a {
  top: 100px;
  left: 100px;
}
.b {
  top: 120px;
  left: 120px;
}
.c {
  top: 140px;
  left: 140px;
}

JavaScript

var divs = document.getElementsByTagName("div");
for(var i = 0; i < divs.length; i++) {
	divs[i].onclick = function() {
		console.log("class clicked: " + this.className);
	};
}


if(document.addEventListener) {
	document.body.addEventListener("click", countDivs);
} else if(document.attachEvent) {
	document.attachEvent("onclick", countDivs);
}

function countDivs(e) {
	e = e || window.event;
	for(var i = 0; i < divs.length; i++) {
		var cStyle = window.getComputedStyle(divs[i]);
		if(divs[i] !== e.srcElement && e.pageX >= parseInt(cStyle.left) && e.pageX <= (parseInt(cStyle.left) + parseInt(cStyle.width)) && e.pageY >= parseInt(cStyle.top) && e.pageY <= (parseInt(cStyle.top) + parseInt(cStyle.height))) {
			divs[i].click();
		}
	}
}