如何将svg节点从一组移动到另一组？

Question

Suppose I have the following document:

<svg>
    <g id='a'>
        <rect id='foo'/>
    </g>
    <g id='b'></g>
</svg>

How do I move my foo rectangle from group #a to group #b ? Preferably with d3 but native JS works too.

Thanks

Answer 1

try:

function setParent(el, newParent) {
    newParent.appendChild(el);
}

setParent(document.getElementById('foo'), document.getElementById('b'));