Select even table elements?

Select even table elements?

Hello everyone: 
I am doing a exercise to select even table elements, then change the background color and font color of the elements.

To me the code should highlight the content in event number of <td> tag (e.g. Name and  Approx. Location)
Could someone explain to me why this happened and what change shall I make, so  the code will highlight the content  in the even number of the <td> tags

  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  5. <html>
  6.  
  7. <head>
  8.   <title>hello world</title>
  9.   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  10.   <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" ></script>
  11.  <script language="JavaScript" type="text/javascript">
  12.   <!--
  13.   
  14.   $(document).ready(function(){
  15.     $('#celebs tr td:even').css('background-color', '#dddddd');
  16.     $('#celebs tr td:even').css('color', '#666');
  17.   });
  18.    
  19.  //-->
  20.  </script>
  21. </head>

  23. <body>
  24.   <table class="data" id="celebs">
  25.    
  26.      <tr>
  27.      <td>ID</td>
  28.      <td>NAME</td>
  29.      <td>OCCUPATION</td>
  30.      <td>Approx. Location</td>
  31.      <td>Price</td>
  32.      </tr>
  33.    </table>
  34. </body>
  35. </html>