JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <div id="box1"></div>
    <div id="box2"></div>
    <div id="box3"></div>
    <div id="box4"></div>
</div>

CSS

#container div {
  position: absolute;
  width: 100px;
  height: 100px;
}
#box1 {
  background: red;
}
#box2 {
  background: blue;
  top: 25px;
  left: 25px;
}
#box3 {
  background: green;
  top: 50px;
  left: 50px;
}
#box4 {
  background: yellow;
  top: 75px;
  left: 75px;
}

CoffeeScript

$('#container').on 'mousedown', (e) ->
  {pageX, pageY} = e
  $(@).children().each (i) ->
    {top, left} = $(@).offset()
    if top <= pageY <= top + $(@).outerHeight() &&
       left <= pageX <= left + $(@).outerWidth()
      console.log 'collision with box ' + i