Thanks! That got me on the right path, Leonardo.

Ended up making each background a different color:

   var colors = new Array("#FC9596","#AF79BB","#A5C0DA","#D2E746");
   $("#menuh li.top > a").each(function (i) {
      $(this).css("background-color",colors[i]);
   });

On Oct 25, 5:20 pm, Leonardo K <leo...@gmail.com> wrote:
> $('#menu li.top > a').css('background-color', 'tan');
>
> The selector is just like CSS.
>
> On Sun, Oct 25, 2009 at 10:25, breadwild <breadw...@gmail.com> wrote:
>
> > Hello,
>
> > I'm building a nested menu where I want to add background colors only
> > to top menu items. I can't change the generated code, so I have to
> > live with the id's and classes as is.
>
> > Relatively new to jQuery so still not used to filtering my selections
> > carefully—is seems to grab everything. Anyway, I have
> > tried: .is, .content, .filter, and some parent, child stuff, but can't
> > seem to only apply the effect to the "top" class—it just selects
> > everything.
>
> > Thoughts? Fundamental concepts welcome. Thanks in advance. —breadwild
>
> > HTML:
>
> > <ul id="menu">
> >   <li class="top"><a href="#">Menu Item 1</a></li>
> >   <li class="top"><a href="#">Menu Item 2</a>
> >      <ul>
> >         <li><a href="#">SubMenu A</a></li>
> >         <li><a href="#">SubMenu B</a></li>
> >      </ul>
> >   </li>
> >   <li class="top"><a href="#">Menu Item 3</a></li>
> >   <li class="top"><a href="#">Menu Item 4</a></li>
> > </ul>
>
> > JAVASCRIPT:
>
> > /* seems like I want something like this, but just colors every <li>
> > with color */
> > $("#menu li").each(function () {
> >   var c = $(this).attr("class");
> >   if ( c == "top" ) {
> >      $("#menu li a").css("background-color","tan");
> >   }
> > });
>
> > /* this works if I want to apply it to <li>, but I want <a> */
> > $("#menu li").each(function () {
> >   var c = $(this).attr("class");
> >   if ( c == "top" ) {
> >      $(this).css("background-color","tan");
> >   }
> > });

Reply via email to