SVG - Adding a line with Javascript
<p>I wrote a simple code to add a line into my svg page when I click a button</p>

<p>This is the html</p>

<pre><code>&lt;body&gt;
&lt;svg  width="500" height="400"&gt;
&lt;/svg&gt;
&lt;button id="btn1"&gt;Append text&lt;/button&gt;
&lt;/body&gt;
</code></pre>

<p>And the Script</p>

<pre><code>$(document).ready(function(){
$("#btn1").click(function(){
      $("svg").append(' &lt;line x1="10" y1="10" x2="40" y2="40" style="stroke: black"&gt;' );
    console.log("done!");
  });
});
</code></pre>

<p>And jsfiddle
<a href="https://jsfiddle.net/dch7xyez/1/" rel="noreferrer">https://jsfiddle.net/dch7xyez/1/</a></p>

<p>The line gets appended but its not visible. Can anyone explain to me why?</p>