title: Capture DOM click event in JavaScript and trigger at later time
body: <p>Been researching this concept for a while now, and still not certain on best approach. </p>
  
  <p>I'd like to capture a click event and trigger any (default or manually attached) events that follow it at a later time. More specifically, I want to record a tracking event when an element in the <code>.container</code> is clicked. After it's been recorded, I want to resume the behaviors of the clicked element. Is this functionality attainable in this manner?</p>
  
  <pre><code>&lt;div class="container"&gt;
      &lt;span&gt;My Text&lt;/span&gt;
      &lt;a href="/myurl"&gt;My Link&lt;/a&gt;
      &lt;button type="submit"&gt;My Button&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I'm adding a click event to the element (whether it has others already or not), and capturing and preventing it's default behavior:</p>
  
  <pre><code>elementInsideContainer.addEventListener('click',e =&gt; {
      e.preventDefault();
      // submit some click tracking data via ajax
      // carry on with other events on element
  });
  </code></pre>
  
  <p>I know I have access to <code>srcElement.href</code> and could <code>window.location</code> the user there when capturing a click event on an <code>&lt;a&gt;</code> tag, but could that really be the best way to do this? What if the element is a <code>type=submit</code> button or just a <code>&lt;span&gt;CLICK ME!&lt;/span&gt;</code> that I want to track (as shown above)? Been reading about <code>dispatchEvent(event)</code> but not sure if it's what I'm looking for.</p>