jQuery Traversing - Descendants
With jQuery you can traverse down the DOM tree to find descendants of an element.
A descendant is a child, grandchild, great-grandchild, and so on.
Traversing Down the DOM Tree
Two useful jQuery methods for traversing down the DOM tree are:
children()
find()
jQuery children() Method
The children()
method returns all direct children of the selected element.
This method only traverses a single level down the DOM tree.
The following example returns all elements that are direct children of each <div>
elements:
You can also use an optional parameter to filter the search for children.
The following example returns all <p>
elements with the class name "first", that
are direct children of <div>
:
jQuery find() Method
The find()
method returns descendant elements of the selected element, all
the way down to the last descendant.
The following example returns all <span>
elements that are
descendants of <div>
:
The following example returns all
descendants of <div>
:
jQuery Exercises
jQuery Traversing Reference
For a complete overview of all jQuery Traversing methods, please go to our jQuery Traversing Reference.