Random lines

<center>
<svg id="svgLine" xmlns="http://www.w3.org/2000/svg" width="500" height="500"/><br>
<button onclick="myFunction()">Click me</button></center>

<script>
function myFunction() {
var svgns = "http://www.w3.org/2000/svg";
for (var i = 0; i < 20; i++) {
    var x1 = Math.random() * 500, y1 = Math.random() * 500;
    var x2 = Math.random() * 500, y2 = Math.random() * 500;
    var strokeWidth = Math.random() * 40;

    var line = document.createElementNS(svgns, 'line');
    line.setAttributeNS(null, 'id', 'oneline');
    line.setAttributeNS(null, 'x1', x1);
    line.setAttributeNS(null, 'y1', y1);
    line.setAttributeNS(null, 'x2', x2);
    line.setAttributeNS(null, 'y2', y2);
    line.setAttributeNS(null, 'stroke-width', strokeWidth);
    line.setAttributeNS(null, 'stroke', '#'+Math.round(0xFFFFFF * Math.random()).toString(16));
    line.setAttributeNS(null, 'opacity', '0.80');
    document.getElementById('svgLine').appendChild(line);
}}

</script>