title: Set script tag from API call in header of index.html
body: <p>I'm trying to implement dynatrace in my react app, and this works fine if I just add the required script tag manually in my index.html header.</p>
  
  <p>However I want to make use of dynatraces api which returns the whole script tag element (so I can use for different environments).</p>
  
  <p>How can I add the script tag to my index.html after calling the api? Creating a script element from code won't work because the response of the api call is a script tag itself (which is returned as string).</p>
  
  <p>I tried creating a div element and adding the script as innerHtml, then append it to the document. But scripts don't get executed in innerHtml text.</p>
  
  <pre><code>const wrapperDiv = document.createElement("div");
  wrapperDiv.innerHTML = "&lt;script&gt;alert('simple test')&lt;/script&gt;";
  document.head.appendChild(wrapperDiv.firstElementChild);
  </code></pre>
  
  <p>Can this be done?</p>
  
  <p>I found a roundabout way of doing this:</p>
  
  <pre><code>const wrapperDiv = document.createElement("div");
  const scriptElement = document.createElement("script");
  wrapperDiv.innerHTML = "&lt;script src=... type=...&gt;&lt;/script&gt;";
  for(let i = 0; i &lt; wrapperDiv.firstElementChild.attributes.length; i++){
      const attr = wrapperDiv.firstElementChild.attributes[i];
      scriptElement.setAttribute(attr.name, attr.value);
  }
  document.head.appendChild(scriptElement);
  </code></pre>
  
  <p>in this example of the script i'm only using a src but this can be done with the value as well. If there is any better way for doing this pls let me know </p>