title: How to change the indentation of new added script tag content
body: <p>i'm using the following code to insert new script with content to HTML file,
  Currently the following code is working and the new script is inserted after the first existing script, the problem is the content is not indent  </p>
  
  <p>e.g. this is the output of the new added script(as you can see its in one line)</p>
  
  <pre><code>&lt;script&gt;  var keyOfFilesArray = Object.keys(data)[0];  var filesArray = data[keyOfFilesArray];          &lt;/script&gt;
  </code></pre>
  
  <p>I want to change it to be indented like following:</p>
  
  <ol>
  <li>the second added open script tag will be inserted line <strong>after</strong> the <strong>closing</strong> tag of the first script</li>
  <li>the vars should be inserted one after other to be like this </li>
  </ol>
  
  <blockquote>
  <pre><code>&lt;script&gt;
  var keyOfFilesArray = Object.keys(data)[0];
  var filesArray = data[keyOfFilesArray];
  &lt;/script&gt;
  </code></pre>
  </blockquote>
  
  <p>How I can do that ? I belive I need to add the /n but not sure where is the best way to insert it...</p>
  
  <p><a href="https://jsfiddle.net/k32ntkr8/" rel="nofollow">https://jsfiddle.net/k32ntkr8/</a></p>
  
  <p><strong>This is the JS code</strong></p>
  
  <pre><code>btn.onclick = function(e){
  debugger;
   var innerhtml = [
          '  var keyOfFilesArray = Object.keys(data)[0];',
          '  var filesArray = data[keyOfFilesArray];          '
      ].join('');
  
      var html = process(input.defaultValue,innerhtml);
      output.value = html;
  
  }
  
  
  function process(html,innerhtml) {
      var escapedHTML = html
          .replace(/body/g, 'body$')
          .replace(/head/g, 'head$');
      sandbox.innerHTML = escapedHTML;
  
      var script = sandbox.querySelectorAll('#app-ux-bootstrap')[0];
  
      var newScript = document.createElement('script');
      newScript.innerText = innerhtml;
      script.parentNode.insertBefore(newScript, script.nextSibling);
  
      var unescapedHTML = sandbox.innerHTML
          .replace(/body\$/g, 'body')
          .replace(/head\$/g, 'head')
          .replace(/&amp;quot;/g, "'");
  
      return (
          '&lt;!DOCTYPE HTML&gt;\n&lt;html&gt;' +
          unescapedHTML +
          '&lt;/html&gt;'
      );
  
  };
  </code></pre>
  
  <p>How it can be done? please suggest ,the answer below doesn't help much...
  if I can improve this question somehow please let me know.</p>