CODEWITHSUNDEEP
jquery
dwlamb
dwlamb

Reputation: 925

Using jQuery to filter for specific nested unordered lists

Doing a tutorial on jQuery I am trying to subtly change a lesson to challenge myself but not having much luck. I've recreated a working prototype here http://jsfiddle.net/dwlamb/gph6b/

When run initially, the definition detail ("Monday to Friday 9-5") is displayed. All other definition details are hidden until the mouse enters another definition list item. This is achieved with the filter on dd in the first line of the jQuery.

How did I achieve the same initial appearance in this example: http://jsfiddle.net/dwlamb/DjR9b/ ?

I am want to hide the store hours for Stores B and C on the initial run and (eventually) program it so that when the mouse enters another first level list item (Store ? Hours) only those hours will be visible. I can not find a way to drill down and filter the second and third occurrences of ul below a parent ul

Upvotes: 0

Views: 68

Answers (1)

Jason Aller
Jason Aller

Reputation: 3652

If you change your:

$('ul ul').filter(':nth-child(n+3)').addClass('hide');

to:

$('ul ul').filter(':gt(0)').addClass('hide');

It will hide all second level unordered lists except the first one. It does this by taking the set of all nested unordered lists and filtering them so that only ones greater than (.gt()) are retained in the active selection.

This could even be shortened to:

$('ul ul:gt(0)').addClass('hide');

Where the filtering is being done as part of the selection rather than as a second separate step.

Upvotes: 1

Related Questions