javascript - How to access the data of a row using jquery -

i have following table forms header of page:

<table class="wpheadertable">     <tr>         <td style="width:10%;"></td>         <td style="width:10%;"></td>         <td style="width:10%;text-align:center;color:#ffffff;">data1</td>         <td style="width:auto;text-align:center;color:#ffffff;">             <a href="<s:url action=" viewappeals "/>" onclick="check" style="color:#fffff;text-decoration:none;">view appeals</a>         </td>         <td style="width:10%;text-align:center;color:#ffffff;">data3</td>         <td style="width:10%;text-align:center;color:#ffffff;">data4</td>         <td style="width:10%;text-align:center;color:#ffffff;">data5</td>         <td style="width:10%;text-align:center;color:#ffffff;">data6</td>         <td style="width:10%;text-align:center;color:#ffffff;">data7</td>         <td style="width:10%;"></td>     </tr> </table> 

when page loaded, viewappeals data of table should have background color of yellow , others should have background color of blue.

the viewappeals data link when clicked redirect page.

how can this?

i have tried script far:

$(document).ready(function(){     $('tr').click(function(){         $('tr td').css({ 'color' : 'none'});         $('td', this).css({ 'color' : '#ccc' });       });  }); 

first, assign id attribute <tr>

<tr id="someid">  </div> 

then select child <td>

$(document).ready(function(){     $('tr#someid').click(function(){         $("tr td").css({ 'color' : 'none'});         $(this + " > td").css({ 'color' : '#ccc' });       });  }); 

you can use > selector select child of clicked element (in case <tr>)