Clone svg elements

Clone svg elements

I'm trying to clone circle components w/in an svg element after first pass but it's putting it in the dom:

  2. <svg width="100%" height="100%" viewBox="0 0 42 42" class="donut">
  3.   ...
  4.   <circle class="donut-segment" cx="21" cy="21" r="15.91549430918954" fill="transparent" stroke="#ce4b99" stroke-width="6" stroke-dasharray="0 0" stroke-dashoffset="25">
  5.     <desc id="donut-segdesc-0">Some description</desc>
  6.   </circle>
  7.   ...
  8. </svg>

Clone & add another circle  & it's desc after the last circle:

  2. var firSeg = $('circle.donut-segment').first();
  3. var lastSeg = $('circle.donut-segment').last();
  4. var newSegi = firSeg.clone();
  5. lastSeg.after(newSegi);  // Trying to place new circle in dom but doesn't happen

What do I need to change?