title: Use JavaScript to update the contents of a script tag dynamically
body: <p>This click event works:</p>
  
  <pre><code>document.getElementById('control').addEventListener('click', function(){
  
     alert('test');
  
  });
  </code></pre>
  
  <p>Why can't I make it the content of a script tag that already exists on the page?</p>
  
  <pre><code>var s = document.getElementsByTagName("script")[0];
  s.innerHTML = "document.getElementById('control').addEventListener('click', function(){alert('test');});";
  </code></pre>
  
  <p>I've tried enclosing the attempt to do something in an IIFE:</p>
  
  <pre><code>s.innerHTML = "(function(){alert('test')}());";
  </code></pre>
  
  <p>so that it will call itself.</p>
  
  <p>Also:</p>
  
  <pre><code>s.innerHTML = "var f = function(){alert('f')}; f();"
  </code></pre>
  
  <p>I'm only interested theoretically and in no way am saying this is a good or bad idea, but how could I make it work?</p>