title: document.getElementById().onClick() not firing on click
body: <p>I have webpack on a vanilla HTML5 page in my Rails app.</p>
  
  <p>I've got the <code>onClick</code> handler defined in Webpack with:</p>
  
  <pre><code>$(document).ready(()=&gt; {
    document.getElementById('add-card').onClick = () =&gt; {
      $('.ui.modal').modal('show');
    }
  });
  </code></pre>
  
  <p>The button renders on the page as:</p>
  
  <pre><code>&lt;a class="ui button" id="add-card"&gt;Click me&lt;/a&gt;
  </code></pre>
  
  <p>Clicking it does nothing. However, within the console, I can see that the handler is defined:</p>
  
  <pre><code>document.getElementById('add-card').onClick
  ƒ () {
      $('.ui.modal').modal('show');
    }
  </code></pre>
  
  <p>And when I execute it with <code>document.getElementById('add-card').onClick()</code>, it works perfectly!</p>
  
  <p>How do I get my onClick handler to fire when the element is clicked?</p>
  
  <p>Edit: For the picky observers, I have jQuery installed and configured properly through Webpack.</p>