CODEWITHSUNDEEP
javascriptjqueryhtmlsvgeach
Lukas
Lukas

Reputation: 7734

Insert SVG elements into HTML tag with jQuery

I have two SVG elements, my markup:

<svg>
  <circle r="260" fill="#1ABCb6" class="" id="svg_el_obj"></circle>
  <circle r="260" fill="#1ABCb6" class="" id="svg_el_obj"></circle>
</svg>

i need to insert them into <g> tag and in output watch this:

<svg>
  <g>
     <circle r="260" fill="#1ABCb6" class="" id="svg_el_obj"></circle>
  </g>
  <g>
     <circle r="260" fill="#1ABCb6" class="" id="svg_el_obj"></circle>
  </g>
</svg>

I try with jQuery but something is not right:

$('#svg_el_obj').each(function(){
   $(this).html('<g></g>');
}

or 

$('#svg_el_obj').each(function(){
   $(this).append('<g></g>');
}

Much thx for help.

Upvotes: 1

Views: 301

Answers (1)

Musa
Musa

Reputation: 97672

You have multiple tags with the same id, id are to be unique. Try using a class instead and wrap

$('.svg_el_obj').wrap('<g>');

Upvotes: 3

Related Questions