title: Adding an onclick event to a button with a button that has an onclick event?
body: <p>I have 2 buttons, one has an onclick event that when clicked calls a function that is supposed to add an onclick event handler to the second button.</p>
  
  <p>I was able to do this little example in w3schools.com, here is the code:</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-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;body&gt;
  
  &lt;p&gt;Click "Try it" to execute the displayDate() function.&lt;/p&gt;
  
  &lt;button id="myBtn2" onclick="addfunc();"&gt;Trigger&lt;/button&gt;
  &lt;button id="myBtn"&gt;Try it&lt;/button&gt;
  
  
  &lt;p id="demo"&gt;&lt;/p&gt;
  
  &lt;script&gt;
  function addfunc(){
  document.getElementById("myBtn").onclick = displayDate();
  }
  
  function displayDate() {
      document.getElementById("demo").innerHTML = Date();
  }
  &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt; </code></pre>
  </div>
  </div>
  </p>
  
  <p>The intended function is that when clicking "Try it" button before "Trigger", nothing happens, and only after clicking "Trigger" the "Try it" button should work. Problem is when I click "Trigger" it actually runs the function that it is supposed to be executed by the click of "Try it" button.</p>
  
  <p>Hope I explained myself, thanks!</p>