title: Dynamically loading HTML into and iframe
body: <p>I'm trying to dynamically add an iframe with HTML to an existing page. I have gotten the iframe to load and show. However the "Body" of the iframe does not show. Any help?        </p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script&gt;
  window.onload = function() {
                  var iframe = document.createElement('iframe');
                  var html =
                      '&lt;html&gt;&lt;head&gt;' +
                          '&lt;scr' + 'ipt src="https://localhost:44302/foo.js"&gt;&lt;/scr' + 'ipt&gt;' +
                          '&lt;scr' + 'ipt src="https://localhost:44302/bar.js"&gt;&lt;/scr' + 'ipt&gt;' +
                      '&lt;/head&gt;' +
                      '&lt;body&gt;Hi&lt;/body&gt;&lt;/html&gt;';
                  iframe.src = 'data:text/html;charset=utf-8,' + encodeURI(html);
                  document.body.appendChild(iframe);
                  console.log('iframe.contentWindow =', iframe.contentWindow);
              }
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;&lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><a href="https://jsfiddle.net/0m5axpxx/2/" rel="nofollow">https://jsfiddle.net/0m5axpxx/2/</a></p>