JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">

<div class="fadeIn">Test 1</div>

</div>

CSS

.fadeIn{
   display: none; 
}

JavaScript

(function fadeInDiv(){
    var divs = $('.fadeIn');
    var divsize = ((Math.random()*100) + 50).toFixed();
    var posx = (Math.random() * ($(document).width() - divsize)).toFixed();
    var posy = (Math.random() * ($(document).height() - divsize)).toFixed();
    var maxSize = 30;
    var minSize = 8;
    var size = (Math.random()*maxSize+minSize)
    
    var elem = divs.eq(Math.floor(Math.random()*divs.length));
    
    $( ".container" ).append( "<div class='fadeIn'>Test RRRRR</div>");

    if (!elem.is(':visible')){
        elem.fadeIn(Math.floor(Math.random()*1000),fadeInDiv);
        elem.css({
            'position':'absolute',
            'left':posx+'px',
            'top':posy+'px',
            'font-size': size+'px'
        });
    } else {
        elem.fadeOut(Math.floor(Math.random()*1000),fadeInDiv); 
    }
})();