1. Home
  2. jQuery traversal - offspring

The best jQuery traversal - offspring Tutorial In 2024, In this tutorial you can learn Traversing the DOM tree down,jQuery children () method,Examples,Examples,jQuery find () method,Examples,Examples,

jQuery traversal - offspring

Descendant is a child, grandson, great-grandchildren, and so on.

By jQuery, you traverse down the DOM tree to find the descendant elements.

Traversing the DOM tree down

Here are two for traversing the DOM tree down jQuery methods:

  • children ()
  • find ()

jQuery children () method

children () method returns the selected element all the direct child elements.

This method only down one pair DOM tree traversal.

The following example returns each <div> element of all direct child elements:

Examples

$(document).ready(function(){
$("div").children();
});

You can also use the optional parameter to filter the search for the sub-elements.

The following example returns the class name of "1" in all <p> elements, and they are <div> direct child elements:

Examples

$(document).ready(function(){
$("div").children("p.1");
});


jQuery find () method

find () method returns the selected element descendant elements, all the way down to the last descendant.

The following example returns belong <div> all <span> element descendants:

Examples

$(document).ready(function(){
$("div").find("span");
});

The following example returns <div> all generations:

Examples

$(document).ready(function(){
$("div").find("*");
});

Hot Tools

Other Tools

Online Tutorial

Website Navigation

jQuery traversal - offspring
10/30