Is it possible to append a div inside an SVG element?
html, javascript, jquery, svg
Solution
You can't append HTML to SVG (technically you can with `foreignObject`, but it's a rabbit hole). Furthermore, visible elements in SVG can't be nested, so elements such as `circle`, `rect`, `path` and such can't have children elements.
Problem
I am trying to append an HTML div inside an SVG, which I am trying to create a graph. I am trying to append it using the code below, but when I inspect element using Firebug, the div is shown inside `rect` element code, but it doesn't show up in the graph UI. Is it something wrong with the method that I am trying or is it impossible to append a div inside an SVG? ``` marker.append("rect") .attr("width", "50px") .attr("height", "50px") .append("div") .attr("id", function(d) { return "canvas_" + d.key.split(" ").join("_"); }) .style("width", "50px").style("height", "50px"); ```