title: How to load an external Javascript file during an "onclick" event?
body: <p>I have 2 divs in my HTML.</p>
  <pre><code>&lt;div id=&quot;div1&quot;&gt;&lt;/div&gt;
  &lt;div id=&quot;div2&quot;&gt;&lt;/div&gt;
  </code></pre>
  <p>On clicking the &quot;div2&quot; I want to load an external javascript file say for example &quot;https://abcapis.com/sample.js&quot;.</p>
  <p>I tried including the JS file on onclick event like below,</p>
  <pre><code>var script = document.createElement(&quot;script&quot;);
  script.type = &quot;text/javascript&quot;;
  script.src = &quot;https://abcapis.com/sample.js&quot;; 
  document.getElementsByTagName(&quot;head&quot;)[0].appendChild(script);
  </code></pre>
  <p>This included the script tag in the head section but did not load since the script tag will be loaded on page load only (correct me here if I'm wrong).</p>
  <p>Is there any other way that I could proceed?</p>
  <p>Thanks in Advance.</p>