JSFiddle - React, Tailwind, and code Playground

by sushanth009

HTML

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

CSS

.a
{
    position:absolute;
    width: 200px;
    height: 200px;
    background-color: orange;
}

.b
{
    position :absolute;
    width: 50px;
    height: 50px;
    background-color: gold;
    top: 25%;
    left: 25%;
}

JavaScript

$(document).ready(function() {
    $('.a').on('click', function(e) {
        if (e.target.className === 'b') {
            e.preventDefault();
        }
        else {
            alert('Outer Div Clicked !!');

        }
    });

    $('.b').on('click', function(e) {
        alert('Inner Div Clicked !!');
    });
});