[jQuery] Re: paint columns in alternating colour

[Liam Potter]

no wonder it didn't work, .Row is only on captions, try this
$(document).ready(function(){
$("table.Grid tr:even td").each().addClass("colouredtd");
});


I did mean to leave spaces yes, you write the selector just like you 
would with CSS.


kevind wrote:
i added it thus:
============================================
$(document).ready(function(){
$(".Grid .Row:even td").each().addClass("colouredtd");
});

style on page=
.colouredtd {background:silver;}
============================================
Did you mean to leave a space between .Grid and .Row ?  I'm new to the
JQuery syntax - does anyone have a page that breaks down how to select
different elements and their child (if that's the right term) elements
- the Selectors section of the JQuery documentation online tends to
deal with divs first.

kd

On Jan 28, 12:05 pm, Liam Potter <radioactiv...@gmail.com> wrote:
  
if you have to have the background color on the td use this

$(document).ready(function(){
$(".Grid .Row:even td").each().css("background","silver");

});

if you can put the background color on the tr instead and leave the td 
transparent it's just this

$(document).ready(function(){
$(".Grid .Row:even").css("background","silver");

});

I'd change .css("background","silver"); to .addClass("classname"); though.

kevind wrote:
    
i have this table structure - a database feeds rows into it with
Class=Row or AltRow
I want to paint the columns in alternating colours for both Row and
AltRow for readability
      
I tried:
$(document).ready(function(){
$(".Grid>.Row>td:even").css("background","silver");
});
      
and other variations - i'm having difficulty selecting the TD's in the
TR of Class 'Row' which is in the table of class 'Grid' - at one point
i got a checkerboard effect  :)   I can give the table an ID if that's
better to pick things out
      
Any help appreciated
=============================================================
      
 <table class="Grid" cellspacing="0" cellpadding="0">
        <caption class="Row">Total Records:&nbsp;5&nbsp;</caption>
         <tr class="Caption">
          <th></th>
          <th></th>
          <th></th>
          <th></th>
          <th></th>
          <th>Manager</th>
          <th>Status</th>
         </tr>
         <tr class="GroupCaption">
          <th style="TEXT-ALIGN: right">&nbsp; </th>
           <th style="TEXT-ALIGN: right">&nbsp; </th>
           <th style="TEXT-ALIGN: right">&nbsp; </th>
           <th style="TEXT-ALIGN: right">&nbsp; </th>
           <th style="TEXT-ALIGN: right">&nbsp; </th>
           <th style="TEXT-ALIGN: right">&nbsp; </th>
           <th style="TEXT-ALIGN: right">&nbsp; </th>
         </tr>
         <tr class="Row">
          <td style="TEXT-ALIGN: right">&nbsp; </td>
          <td style="TEXT-ALIGN: right">150 </td>
          <td>ExamOne Hamilton </td>
          <td>printer </td>
          <td>&nbsp; </td>
          <td>Laura Felker </td>
          <td>Un-Assigned </td>
        </tr>
         <tr class="Row">
          <td style="TEXT-ALIGN: right">&nbsp; </td>
          <td style="TEXT-ALIGN: right">150 </td>
          <td>&nbsp;  </td>
          <td>monitors </td>
          <td>&nbsp; </td>
          <td>&nbsp;  </td>
          <td>Un-Assigned </td>
        </tr>
  <tr class="Footer">
          <td colspan="7">
   <!-- ..nav buttons appear here -->
 </tr>
</table>