JSFiddle - React, Tailwind, and code Playground

HTML

<svg>
  <symbol id="tri" viewBox="0 0 100 100">
      <path d="M0,0l100,0l-100,100,l0,-100z" />
  </symbol>

  <use xlink:href="#tri" x="50" y="50" width="50" height="50" />
</svg>

JavaScript

var svgElem = document.getElementsByTagName("svg")[0];

var xmlns = "http://www.w3.org/2000/svg";
var xlinkns = "http://www.w3.org/1999/xlink";

var use= document.createElementNS(xmlns, "use");
  //
  use.setAttributeNS( xlinkns, "href","#tri");
  use.setAttribute( "x","100");
  use.setAttribute( "y","100");
  use.setAttribute( "width","50");
  use.setAttribute( "height","50");

svgElem.appendChild(use);