title: How to properly use innerHTML
body: <p>I have a link, that when I click it calls a javascript function with a string argument. This string is actually an a-tag+script-tag, like:</p>
  
  <pre><code>&lt;a&gt;..&lt;/a&gt;&lt;script&gt;...&lt;/scipt&gt;
  </code></pre>
  
  <p>which displays a video file.</p>
  
  <p>So anyways, the javascript function is supposed to create that code, and make the video show on the page, but what shows up when I press the link is a string of the code, so its showing as text (but part of it is a hyperlink) and not executing to become the video.</p>
  
  <p>Anyone know why?</p>
  
  <p>Its weird, because if I copy the code (which displays as text), and paste it in the editor like normal, then the video shows...</p>
  
  <pre><code>&lt;a title="Click to Show Video" href='javascript:void(0);' onclick="switchFunc('{$thisNode/@*[name()=current()/@Name]}');"&gt;
      &lt;div dir="{@Direction}" class="ms-rtestate-field"&gt;
        &lt;xsl:value-of select="$thisNode/@*[name()=current()/@Name]" disable-output-escaping="yes"/&gt;
      &lt;/div&gt;
  &lt;/a&gt;
  
  
  
  
  &lt;script type="text/javascript"&gt; 
    function switchFunc(source) {
      document.getElementById('videoContainer').innerHTML = source;
    }  
  &lt;/script&gt;
  
  &lt;div id="videoContainer"&gt;    &lt;/div&gt;
  </code></pre>