title: JavaScript onclick function only works once (very simple code)
body: <p>I know there are many topics about this, but they address some variable issue. Mine is much more simple, but it is not working. Only works once. </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var bt1;
  document.addEventListener('DOMContentLoaded', load);
  
  function load() {
    document.body.innerHTML += '&lt;div&gt;welcome&lt;/div&gt;';
    bt1 = document.getElementById('bt1');
    bt1.onclick = clicked;
  }
  
  function clicked() {
    document.body.innerHTML += '&lt;div&gt;welcome&lt;/div&gt;';
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;body&gt;
    &lt;button id="bt1"&gt;Click me&lt;/button&gt;
  &lt;/body&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I tried taking the <code>clicked</code> function in and out of the <code>onclick</code> statement (as some other topics suggested).</p>
  
  <p>I also tried moving the <code>bt1</code> variable declaration around (and not using a variable at all).</p>