JSFiddle - React, Tailwind, and code Playground

by Hieu Hoang

HTML

<div id="parent">
    <div id="children"></div>
</div>

CSS

#parent {
        width: 200px;
        height: 200px;
        position: relative;
        border: 1px solid black;
    }

        #parent:hover {
            cursor: pointer;
            background: green;
        }

    #children {
        width: 100px;
        height: 100px;
        position: absolute;
        top: 10px;
        left: 10px;
        border: 1px solid black;
    }

        #children:hover {
            cursor: pointer;
            background: blue;
        }

JavaScript

$('#children').dblclick(function () {
        alert('children');
    });
    $('#parent').dblclick(function () {
        alert('parent');
    });