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"); > > } > > });