The nth-child index is relative to the whole collection of children
elements, not just the one you're selecting. With your new mark-up
you're better off doing this:

$(".insidepost ul + p")
//or
$(".insidepost p:first")
    .addClass("caminfo")
    .next('p').addClass("cambuy")
    .next('p').addClass("cam..");

Looks a bit clearer to me and is safer in case you add other elements
before the paragraphs.

This is the first real possible use I've seen of the CSS3 nth-of-type
selector!

On Apr 29, 12:13 pm, Tobias <tobi...@gmail.com> wrote:
> Perfect.  But just for future helpfulness of anyone coming across this
> post- I simplified my code above, it actually looks like
>
> > > <div class="insidepost">
>
> <iframe>Blah Blah Blah</iframe>
> <ul>
> <li>item 1</li>
> <li>item 2</li>
> <li>item 3</li>
> </ul>
>
> > > <p>paragraph 1</p>
> > > <p>paragraph 2</p>
> > > <p>paragraph 3</p>
> > > </div>
>
> As a consequence I need to use $(".insidepost p:nth-child(3)").addClass
> ("caminfo"); to get it to add that class to the FIRST paragraph.  Not
> sure why it counts other items in the list of children. . . or maybe I
> don't quite understand how the child works - I thought it was just
> counting the P children inside the div.
>
> Anyway - Thanks Ricardo, appreciate the help.
>
> --Tobias
>
> On Apr 28, 11:11 pm, Ricardo <ricardob...@gmail.com> wrote:
>
> > That's because eq() filters the whole collection of Ps from all DIVs.
> > Use nth-child instead (indexes start at 1 instead of 0):
>
> > $(".insidepost p:nth-child(1)").addClass("cambottomline");
> > $(".insidepost p:nth-child(2)").addClass("cambuy");
>
> > cheers,
> > - ricardo
>
> > On Apr 28, 10:15 pm, Tobias <tobi...@gmail.com> wrote:
>
> > > Hello - My basic code is something like
>
> > > <div class="insidepost">
> > > <p>paragraph 1</p>
> > > <p>paragraph 2</p>
> > > <p>paragraph 3</p>
> > > </div>
>
> > > <div class="insidepost">
> > > <p>paragraph 1</p>
> > > <p>paragraph 2</p>
> > > <p>paragraph 3</p>
> > > </div>
>
> > > I was hoping to use
>
> > >                 $(".insidepost p:eq(1)").addClass("cambottomline");
>
> > >                 $(".insidepost p:eq(2)").addClass("cambuy");
>
> > > Only works on the first div though.  Any suggestions for selecting the
> > > same certain P in each div?
>
> > > Thank you,
> > > Tobias

Reply via email to