JSFiddle - React, Tailwind, and code Playground

by Igaojsfiddle

HTML

<input type="button" id="append" value="Append">
<div id="notifications"></div>

CSS

.div-notification {
    height:60px;
    width:200px;
    background-color:red;
    text-align:center;
    vertical-align:center;
    margin-bottom:2px;
    border-radius:5px;
}

JavaScript

//$('#div').show().delay(5000).fadeOut(5000);

$(document).ready(function () {
    $('#append').click(function () {
        var abc = $('<div class="div-notification">Now you see me</div>');

        abc.hide().prependTo('#notifications').fadeIn(1000).delay(5000).fadeOut(1000);

    });
    
    $('#notifications').on("click",".div-notification", function () {
        $(this).remove();
    });
});