Random circles

<div style="text-align:center">
<svg id="svgThree" xmlns="http://www.w3.org/2000/svg" width="500" height="500"></svg><br/>
<button onclick="myFunction3()">Start !</button></div>
<script>
function myFunction3() {
var svgns = "http://www.w3.org/2000/svg";
for (var i = 0; i < 50; i++) {
    var cx = Math.random() * 500, cy = Math.random() * 500;
    var r = Math.random() * 50; var strokewidth = Math.random() * 10;

    var circle = document.createElementNS(svgns, 'circle');
    circle.setAttributeNS(null, 'cx', cx);
    circle.setAttributeNS(null, 'cy', cy);
    circle.setAttributeNS(null, 'r', r);
    circle.setAttributeNS(null, 'fill', '#'+Math.round(0xFFFFFF * Math.random()).toString(16));
    circle.setAttributeNS(null, 'opacity', '0.75');
    circle.setAttributeNS(null, 'stroke', '#'+Math.round(0xFFFFFF * Math.random()).toString(16));
    circle.setAttributeNS(null, 'stroke-width', strokewidth);
    document.getElementById('svgThree').appendChild(circle);
}}

</script>