title: Material UI Icon created from document.createElementNS in React is not loading correctly
body: <p>I'm creating a tags section in my app similar to the tags section in a new Stack Overflow question form. I'm using the Material UI close icon as shown in this <a href="https://www.youtube.com/watch?v=ha4xwcJXwow&amp;ab_channel=FrontendTips" rel="nofollow noreferrer">youtube tutorial</a> (I know I installed the Material UI Icons correctly because the demo icons I created work, just the ones I dynamically created using document.createElementNS doesn't work - and the video tutorial is only for vanilla javascript tutorial without React implementation. I'm doing the conversion to React process currently)</p>
  <p>I tried force updating/rendering the React app using this answer here on Stack Overflow - <a href="https://stackoverflow.com/questions/46240647/react-how-to-force-a-function-component-to-render">React - How to force a function component to render?</a> - but that still doesn't make the Material UI Icon load into the correct SVG form.</p>
  <p>My code looks like as follows: (I'm using createElementNS instead of createElement because I'm thinking I need to use the proper capitalized HTML tag for the Material UI Icon to work - ie.  -&gt; )</p>
  <pre class="lang-js prettyprint-override"><code>  const formTagContainer = useRef(null);
  
    function createTag(label) {
      const div = document.createElement(&quot;div&quot;);
      const closeBtn = document.createElementNS(&quot;&quot;, `CloseIcon`);
      div.appendChild(closeBtn);
      return div;
    }
  
    useEffect(() =&gt; {
      formTagContainer.current.appendChild(createTag(&quot;Jumbotron&quot;));
    }, []);
  
    return (
      &lt;&gt;
        &lt;div ref={formTagContainer} className=&quot;tagContainer&quot; /&gt;
      &lt;/&gt;
    );
  </code></pre>
  <p>The above code just generates <code>'&lt;div&gt;&lt;CloseIcon&gt;&lt;/CloseIcon&gt;&lt;/div&gt;'</code> without switching the <code>&lt;CloseIcon&gt;&lt;/CloseIcon&gt;</code> part into the SVG form of the Close Icon button. When I use the CloseIcon button normally in the JSX tho, it works fine. So I have one working and one non-working version rendered at the same time. Force-rerendering the app doesn't seem to make the icon turn into the SVG format. How could I load the icon dynamically in React?</p>