JSFiddle - React, Tailwind, and code Playground

by eddiemonge

HTML

<div id="red">
</div>

CSS

#red {
    background: red;
    width: 300px;
    height: 300px;
    margin: 100px;
    overflow: auto;
}

.blue {
    background: blue;
    opacity: .5;
    width: 280px;
    height: 280px;
    margin: 10px;
}

JavaScript

$('#red').hover(
    function() {
        $(this).append('<div class="blue" />');
    },
    function() {
        $(this).find('.blue').remove();
    }
);