JSFiddle - React, Tailwind, and code Playground

HTML

<svg class="SVGInline-svg" xmlns="http://www.w3.org/2000/svg">
  <symbol id="Icon">
    <circle cx="100" cy="100" r="100" fill="green" />
  </symbol>
</svg>

<div id="container"></div>

JavaScript

var container = document.getElementById('container');
var root = document.createElement('root');
var input1 = document.createElement('input');
var input2 = document.createElement('input');
var svg = document.createElementNS("http://www.w3.org/2000/svg", 'svg');
var use = document.createElementNS('http://www.w3.org/2000/svg', 'use');

use.setAttributeNS( "http://www.w3.org/1999/xlink", "href", "#Icon" );

svg.appendChild(use)
root.appendChild(input1)
root.appendChild(svg)
root.appendChild(input2)
container.appendChild(root)