Untitled

<!DOCTYPE HTML>

<html lang="en">
<head>
    <title><!-- Insert your title here --></title>

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

<script>

function draw() {
    var c = document.getElementById('canvas').getContext('2d');

    for(var j=0;j<6;j++) {
        setTimeout(function(){squares(c)}, 100);
        //squares(c);
    }
}

function squares(c)
{

        for(var i=0; i<30; i++)
        {
            var randX = Math.floor(Math.random() *250);
            var randY = Math.floor(Math.random() * 250);
           // c.fillStyle ='rgb(0,' + Math.floor(255-42.5*i) + ',' + Math.floor(255-42.5*i) + ')';
            c.fillStyle = 'rgb(' + (Math.floor(Math.random() * 255)) + ',' + (Math.floor(Math.random() * 255))  + ',' + (Math.floor(Math.random() * 255))  + ')';
            //c.fillStyle = 'red';
            c.fillRect(randX, randY, 10, 10);
        }
}

</script>
</head>
<body>
    <!-- Insert your content here -->

    <canvas id="canvas" width="250" height="250"></canvas>


        <input type='submit' value=' canvas me' onclick='draw()'>
      </div>
</body>
</html>