title: JQuery - Clickable table row, except last cell
body: <p>I'm trying to user JQuery to make a table row clickable and redirect to a URL which is hidden in the first cell.
  I've got an image in the last column of the table which should redirect to a different URL.</p>
  
  <p>JQuery is as follows.</p>
  
  <pre><code>$(function () {
      $('#link-table td:first-child').hide();
  
      $('#link-table tr').hover(function () {
          $(this).toggleClass('highlight');
      });
  
      $('#link-table tr').click(function () {
          location.href = $(this).find('td a').attr('href');
      });
  });
  </code></pre>
  
  <p>Clicking the row works, clicking the image hyperlink in the last cell redirects to the same URL as clicking the row which isn't what I want.</p>
  
  <p>I tried using this code for the click event</p>
  
  <pre><code>$('#link-table tr td:not(:last-child))').click(function () {
          location.href = $(this).find('td a').attr('href');
      });
  </code></pre>
  
  <p>Clicking the image hyperlink in the last cell works but clicking the row now redirects to the URL attached to the image hyperlink in the last cell.</p>
  
  <p>How can I get it so clicking the row redirects to one URL, clicking the hyperlink in the last cell redirects to another?</p>