title: Javascript add style tag to head
body: <p>I'm trying to add some css to an internal stylesheet with javascript. This is the code I've used: </p>
  
  <pre><code>function googleJS(){
      var iframe = document.getElementsByTagName('iframe')[0];
      var doc = iframe.contentWindow.document;
      var newScript = doc.createElement('style');
      newScript.setAttribute('.skiptranslate { display: none; }');
      var bodyClass = doc.getElementsByTagName('head')[0];         
      bodyClass.insertBefore(newScript, bodyClass.childNodes[2]);
  }
  </code></pre>
  
  <p>However this results in: </p>
  
  <pre><code>&lt;style .skiptranslate {display: none};&gt;&lt;/style&gt; 
  </code></pre>
  
  <p>What is the proper method to use javascript to insert a style tag with the necessary CSS inside the DOM?</p>
  
  <p>Thanks</p>