title: How to link table row to external URL with Javascript?
body: <p>I my app I have a table like this:</p>
  <pre><code>&lt;tr data-url=&quot;/entry/57/edit&quot;&gt;
    &lt;td&gt;
      Text
    &lt;/td&gt;
    &lt;td&gt;
      &lt;a href=&quot;https://www.external.com&quot;&gt;Link 1&lt;/a&gt;
    &lt;/td&gt;
    &lt;td&gt;
      &lt;a href=&quot;https://www.external.com&quot; target=&quot;_blank&quot;&gt;Link 2&lt;/a&gt;
    &lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  <p>This is my Javascript:</p>
  <pre><code>function TableRow() {
  
    const rows = document.querySelectorAll('table tr[data-url]');
  
    rows.forEach(row =&gt; {
      row.addEventListener('click', function(e) {
        handleClick(row, e);
      });
    });
  
    function handleClick(row, e) {
      let url = row.getAttribute('data-url');
      window.document.location = url;
    }
  
  }
  
  document.addEventListener('DOMContentLoaded', TableRow);
  </code></pre>
  <p>How come that clicking on <strong>Link 1</strong> takes me to <code>www.external.com</code> (which is what I want) but clicking on <strong>Link 2</strong> takes me to <code>/entry/57/edit</code> (which is <em>not</em> what I want)?</p>
  <p>I want both links to take me to <code>www.external.com</code>. How can this be done?</p>