JSFiddle - React, Tailwind, and code Playground

HTML

<div id="result"> Result div</div>
<p>
  click any element from these 3 element  for getting their coordinates.
</p>
<div class="cords_div">
</div>

CSS

p {
    margin-top: 10px;
    color: red;
    width: 100%;
  }
 
  div.cords_div {
    width: 60px;
    height: 60px;
    position: absolute;
    left: 50px;
    top: 100px;
    background-color: grey;
   
  }

JavaScript

$( "*", document.body ).click(function( event ) {
  var mthd = $( this ).offset();
  event.stopPropagation();
  $( "#result" ).text( this.tagName +
    " coordinates ( " + mthd.left + ", " + mthd.top + " )" );
});