title: jquery highlight and unhighlight table row
body: <p>I have a table with multipul rows, i have each odd row set one shade of grade and the even a slight different shade so each row is easier to read. </p>
  
  <p>Upon click event i am highlighting that row with a different colour so you know which record has been selected, however when clicking a different row I'm unsure how to delect/revert the colour back to its original.</p>
  
  <p>Instead I'm what I'm having todo is cheat?! and set all the rows back to the alternate grey colours, and then apply the new highlighted colour to the selected row.</p>
  
  <p>I was wondering if there is a better way to do this.</p>
  
  <pre><code>$(document).on("click","#div2 tr#abc", function(event) {
  
      barcode = $(this).data('barcode');
  
      $('tr:odd[id="abc"]').css('backgroundColor', '#FAFAFA');
      $('tr:even[id="abc"]').css('backgroundColor', '#F2F2F2');
  
      $(this).css('backgroundColor','#FFD6F5');
  
  });
  </code></pre>