jQuery
Traversing the DOM
Navigate relatives and filter the matched set.
By EZ4Code Team
traversingnavigation
Code
// Moving around the tree
$("#item").parent(); // direct parent
$("#item").parents(".wrap"); // nearest ancestor matching
$("#item").children(".active");// direct children
$("#item").find("a"); // all descendants
// Siblings
$("#item").next();
$("#item").prev();
$("#item").siblings();
// Filtering
$("li").first();
$("li").last();
$("li").eq(2); // third item (0-indexed)
$("li").filter(".active");
$("li").not(".disabled");
// Chaining traversal
$("#start").parent().find("a").first().addClass("link");Explanation
Traversal methods navigate relative to the current matched set: parent/children/find move up and down, siblings/next/prev move sideways. filter() and not() narrow the set by a selector or function. Each method returns a new jQuery object for chaining.
More jQuery Snippets
Selectors
Select elements by id, class, attribute, and pseudo-filters.
Events & Delegation
Bind handlers with on(), support delegation and namespaced removal.
DOM Manipulation
Get/set text, html, attributes, classes, and insert nodes.
AJAX Requests
Use $.ajax, $.get, $.post, and load with promises.
Effects & Animation
Show, hide, fade, slide, and animate elements.
Utility Methods
Iterate, merge, and filter with jQuery helpers.