<center><svg id="svgTwo" xmlns="http://www.w3.org/2000/svg" width="500" height="500" >
</svg><br>
<button onclick="myFunction()">Click me</button></center>
<script>
function myFunction() {
var svgns = "http://www.w3.org/2000/svg";
for (var i = 0; i < 50; i++) {
    var x = Math.random() * 500, y = Math.random() * 500;
    var width = Math.random() * 50, height = Math.random() * 50;

    var rect = document.createElementNS(svgns, 'rect');
    rect.setAttributeNS(null, 'x', x);
    rect.setAttributeNS(null, 'y', y);
    rect.setAttributeNS(null, 'width', width);
    rect.setAttributeNS(null, 'height', height);
    rect.setAttributeNS(null, 'fill', '#'+Math.round(0xFFFFFF * Math.random()).toString(16));
    rect.setAttributeNS(null, 'opacity', '0.75');
    document.getElementById('svgTwo').appendChild(rect);
}}
</script>