Jugal | Grouping SVG elements dynamically

http://stackoverflow.com/questions/12548386/grouping-svg-elements-dynamically Jugal Thakkar http://jugal.me/

by Jugal Thakkar

HTML

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.js" ></script>
<div id="container">
  <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <rect width="300" height="100" style="fill:rgb(0,0,255);stroke-width:1;stroke:rgb(0,0,0)"/>
     <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red" />
     <text x="0" y="15" fill="red">I love SVG</text>
  </svg>
</div>
<button id="btn">Do</button>

JavaScript

$("#btn").click(function() {
    $("#container svg > *").wrapAll('<g id="parent" />');
//    #("#parent").show();    
});