How do I remove all children elements from a node and then apply them again with different color and size?

Your answer will work, but for posterity, these methods are more generic.

Remove all children from HTML:

d3.select("div.parent").html("");

Remove all children from SVG/HTML:

d3.select("g.parent").selectAll("*").remove();

The .html("") call works with my SVG, but it might be a side effect of using innerSVG.