title: Replace the linearGradient in a SVG with jQuery
body: <p>I can remove the line linearGradient with jQuery in a SVG but I can't add it. Why? </p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;textarea&gt;
  &lt;linearGradient y2="1" x2="1" id="g" spreadMethod="reflect"&gt;
  &lt;stop stop-color="#F00" offset="0"/&gt;
  &lt;stop stop-color="#F0F" offset="1"/&gt;
  &lt;/linearGradient&gt;
  &lt;style type="text/css" &gt;
  &lt;![CDATA[
      path {  stroke: #009900;  
              stroke-width: 0.1;  
              fill:url(#g);}
  ]]&gt;
  &lt;/style&gt;
  &lt;/textarea&gt;
  </code></pre>
  
  <p><strong>JS</strong></p>
  
  <pre><code>$('#remove').click(function()
  {
      $('svg style, svg linearGradient').remove(); 
  });
  $('#set').click(function()
  {
      $('svg').prepend($('textarea').val());       
  });
  </code></pre>
  
  <p><strong>Fiddle</strong>
  <a href="http://jsfiddle.net/qt2ony7v/" rel="nofollow">http://jsfiddle.net/qt2ony7v/</a></p>