JSFiddle - React, Tailwind, and code Playground

HTML

<button class="openWindow" id="btnDocument">Run</button>
<div style="position:absolute;left:30px;right:30px;bottom:30px;top:30px;">

<div style="position:absolute;top:60px;left:4px;width:20px"></div>
<div id="divDocument" class="visibleDiv" style="display:none;position:absolute;width:100%;height:100%;background-color:gray">

</div>

</div>

JavaScript

$(document).ready(function () {

        $(".openWindow").click(function () {
             $("#divDocument").append("<div>hello</div>");



            var divToShow = $("#divDocument");
         
            var windowWidth = $(window).width();
            var leftOut = (windowWidth * -1);
            var leftIn = windowWidth + 500;

            divToShow.css({ left: leftIn });
            divToShow.show();
            divToShow.animate({ left: 0 }, 400, function () {
                divToShow.addClass("visibleDiv");
            });

            //for (var i = 0; i < 10000; i++) {
            //    $("#divDocument").append("<div>hello</div>");
            //}



            
                
            
          
        });

       

    });