title: How to inject HTML, CSS and jQuery in realtime to iframe
body: <p>I am trying to build a HTML, CSS and jQuery (not just JavaScript) editor, and show the rendered content in an iFrame. Although adding HTML, CSS part is easy, I am unable to execute the JavaScript part.</p>
  
  <pre><code>var html = ""; // HTML code
  var content = $("#preview").contents().find("body"); // iframe id is 'preview'
  content.html(html);
  
  var cssLink = "&lt;style&gt;" + csVal + "&lt;/style&gt;"; // cssVal contains css code
  var head = $("#preview").contents().find("head");
  head.append(cssLink);
  
  var js ='&lt;script&gt;'+jsEditor()+'&lt;\/script&gt;' ; 
  
  // following part is not working
  var content = $('#preview').contents();
  $content.find('head').append('&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"&gt;&lt;\/script&gt;' );             
  $content.find('body').append(js );
  </code></pre>
  
  <p>I am able to execute to core JavaScript using window.eval(), however it is not working for any JS library included, e.g. jQuery etc.</p>