Any way to animate part of a group in jquery svg?

Any way to animate part of a group in jquery svg?

The obvious solution I suppose would be to create a new group then add selected nodes to that new group and animate that. But is there any way to add existing svg nodes to a group?

For example, I know you can do this:

var g = svg.group({fill: 'red'});
var c1 = svg.circle(g, 75, 75, 20);
var c2 = svg.circle(g, 115, 75, 20);
var c3 = svg.circle(g, 155, 75, 20);
$(g).animate({svgTransform: 'translate(100)'}, 500);

But can you create a group and add existing nodes to it?

Otherwise, is there any other way to group nodes on the开发者_StackOverflow中文版 fly?

Cheers.

---

Have you tried something like this:

var svgns = 'http://www.w3.org/2000/svg';

var svgRoot = document.getElementsByTagNameNS(svgns, 'svg')[0];

var newGroup = document.createElementNS(svgns, 'g');
var $newGroup = $(newGroup);
svgRoot.appendChild(newGroup);

var c1 = svg.circle(g, 75, 75, 20);
$newGroup.append(c1);