HI Karl,
That is exactly the answer i was looking for.
Thank You
On Nov 24, 5:49 pm, Karl Swedberg <[EMAIL PROTECTED]> wrote:
> Hi Jon,
>
> You're almost there! What you want is to add a class to every td that
> is the first child of its parent. Using td:first will select only the
> very first td. You need td:first-child ! So, this line ...
>
> > $(".Grid tbody tr td:first").removeClass("GridMiddleCell");
>
> should change to this ...
>
> $(".Grid tbody tr td:first-
> child").removeClass("GridMiddleCell").addClass("GridLeftCell");
>
> If you only have three columns, you can add classes to each column's
> cells like so:
>
> var $cells = $(".Grid tbody tr td");
>
> $cells.filter(":first-child").addClass("GridLeftCell");
> $cells.filter(":nth-child(2)").addClass("GridMiddleCell");
> $cells.filter(":nth-child(3)").addClass("GridRightCell");
>
> Hope that helps.
>
> --Karl
>
> _________________
> Karl Swedbergwww.englishrules.comwww.learningjquery.com
>
> On Nov 24, 2007, at 9:25 AM, jonhobbs wrote:
>
>
>
> > Hi,
>
> > I've just read the Jquery book and though I understood a bit about
> > selectors, turned out I was wrong!
>
> > I am trying style every cell in a table but style the left and right
> > most colums differently.
>
> > I start with three classes....
>
> > GridLeftCell
> > GridMiddleCell
> > GridRightCell
>
> > ... and I style every cell with "GridCellMiddle"
>
> > I then try to replace the class on all cells in the first column by
> > doing the following..
>
> > $(document).ready(function(){
>
> > $(".Grid tbody td").addClass("GridMiddleCell");
>
> > $(".Grid tbody tr td:first").removeClass("GridMiddleCell");
> > <-----------------
> > });
>
> > I thought this would drill down to each TR and select the first TD in
> > eact TR, but it is only affecting the first cell in the first row.
>
> > Anybody know what selector I am supposed to be using ?
>
> > Thanks, Jon
