title: JS. How to replace html element with another element/text, represented in string?
body: <p>I have a problem with replacing html elements.</p>
  
  <p>For example, here is a table:</p>
  
  <pre><code>&lt;table&gt;
      &lt;tr&gt;
          &lt;td id="idTABLE"&gt;0&lt;/td&gt;
          &lt;td&gt;END&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>(it can be div, span, anything)</p>
  
  <p>And string in JavaScript:</p>
  
  <pre><code>var str = '&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;';
  </code></pre>
  
  <p>(It can be anything, <code>123 text</code>, <code>&lt;span&gt;123 element&lt;/span&gt; 456</code> or <code>&lt;tr&gt;&lt;td&gt;123&lt;/td&gt;</code> or anything)</p>
  
  <p>How can I replace element <code>idTABLE</code> with <code>str</code>?</p>
  
  <p>So:</p>
  
  <pre><code>&lt;table&gt;
      &lt;tr&gt;
          &lt;td id="idTABLE"&gt;0&lt;/td&gt;
          &lt;td&gt;END&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>Becomes:</p>
  
  <pre><code>&lt;table&gt;
      &lt;tr&gt;
          &lt;td&gt;1&lt;/td&gt;
          &lt;td&gt;2&lt;/td&gt;
          &lt;td&gt;END&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt; 
  &lt;!-- str = '&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;'; --&gt;
  
  &lt;table&gt;
      &lt;tr&gt;
          123 text
          &lt;td&gt;END&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  &lt;!-- str = '123 text' --&gt;
  
  &lt;table&gt;
      &lt;tr&gt; 
          &lt;td&gt;123&lt;/td&gt; 
          &lt;td&gt;END&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  &lt;!-- str = '&lt;td&gt;123&lt;/td&gt;' --&gt;
  </code></pre>
  
  <p>I tried <code>createElement</code>, <code>replaceChild</code>, <code>cloneNode</code>, but with no result at all =(</p>