JSFiddle - React, Tailwind, and code Playground

HTML

<div id="a">a</div>
<div id="b">b</div>
<div id="c">c</div>
<div id="output"></div>

CSS

#a {
    position:absolute;
    top:0;
    left:0;
    width: 100px;
    height:100px;
    background-color:yellow;
}
#b {
    position:absolute;
    top:50px;
    left:50px;
    width: 100px;
    height:100px;
    background-color:green;
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}
#c {
    position:absolute;
    top:50px;
    left:200px;
    width: 50px;
    height:50px;
    background-color:orange;
}
#output {
    width: auto;
    height: auto;
    font-size: 11px;
    position: absolute;
    top: 300px;
}

JavaScript

$(document).click(function (e) {
    var hitElements = getHitElements(e);
    var output = $('#output');
    output.html('');
    for (var i = 0; i < hitElements.length; ++i) {
        output.html(output.html() + '<br />' + hitElements[i][0].tagName + ' ' + hitElements[i][0].id);

    };

});

var getHitElements = function (e) {
    var x = e.pageX;
    var y = e.pageY;
    var hitElements = [];
    $(':visible').each(function () {
        console.log($(this).attr("id"), $(this).outerWidth());
        var offset = $(this).offset();
        console.log('+++++++++++++++++++++');
        console.log('pageX: ' + x);
        console.log('pageY: ' + y);
        console.log($(this).attr("id"), $(this).offset());
        console.log('+++++++++++++++++++++');
        if (offset.left < x && (offset.left + $(this).outerWidth() > x) && (offset.top < y && (offset.top + $(this).outerHeight() > y))) {
            console.log('included: ', $(this).attr("id"));
            console.log('from 0p far x: ', $(this).attr("id"), offset.left + $(this).outerWidth());
            console.log('from 0p far y: ', $(this).attr("id"), offset.top + $(this).outerHeight());
            hitElements.push($(this));
        }
    });

    return hitElements;

}