JSFiddle - React, Tailwind, and code Playground

by dinkleburg

HTML

<svg id="one" width="250" height="250">
    <circle class="little" cx="45" cy="90" r="5" />
</svg>

<svg id="two" width="250" height="250">    
</svg>

<button type="button">Move Circle</button>

CSS

.little {
    fill: steelblue;
    stroke: #666;
    stroke-width: 2px;
}

svg {
    border: solid 1px black;
}

JavaScript

d3.select("button").on("click", function() {
    d3.select("#two").append(function() {
        var circle =  d3.select("#one").select("circle").remove();
        return circle[0][0];
    });
});