JSFiddle - React, Tailwind, and code Playground

HTML

<script src="jQuery_2.1.4.js"></script>

    <link rel="stylesheet" type="text/css" href="style.css">

    <title>Title</title>

<body>
<h3 id="success"></h3>
    <div id="box"></div>
    <script src="script.js"></script>
</body>
</html>

CSS

#box{
    width: 50px;
    height:50px;
    background-color:red;
    position:fixed;
}

JavaScript

var div = $('#box');
$(document).ready(function(){Animate();});

function GetNewPosition(){
    // Get dimentions of the window and remove the div area
    var h = $(window).height() - 50;
    var w = $(window).width() - 50;
    // New height and width is auto generated
    var nh = Math.floor(Math.random() * h);
    var nw = Math.floor(Math.random() * w);
    return [nh,nw];
}
function Animate(){
    var _newPosition = GetNewPosition();
    // Sets new position of div
    div.animate({top: _newPosition[0], left:_newPosition[1]}, function(){
        div.on('click', function(){
            alert('You clicked the box!');
        });
        Animate();
    });
}