jQuery .addBack(): Include the Previous Traversal Selection
.addBack() combines the current selection with the immediately previous selection in the traversal stack. For example, use it after .find() to style matching descendants together with their original containers.
Syntax and behavior
$(".panel").find(".item").addBack();
$(".panel").find(".item").addBack(".selected");
Traversal methods create a new selection while remembering the previous one. .addBack() does not include every earlier selection or every ancestor automatically. Its optional selector filters only the previous selection before it is combined; the current selection is not filtered by that argument.
The official jQuery .addBack() documentation describes additional call signatures and argument types.
Complete runnable example
Save the following code as a UTF-8 example.html file and open it in a browser. It loads the full jQuery 4.0.0 build from an external URL, so an internet connection is required. The $(function () { ... }) callback waits for the document to be ready before running the example.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery addBack example</title>
<style>
body { margin: 24px; font-family: sans-serif; line-height: 1.6; }
.marked { background: #fff0b3; border: 2px solid #835b00; }
.active { color: #a00000; font-weight: bold; }
button, input, select { font: inherit; }
#output { white-space: pre-wrap; overflow-wrap: anywhere; }
</style>
<script src="https://code.jquery.com/jquery-4.0.0.min.js"></script>
</head>
<body>
<div class="panel selected" id="a"><p class="item">First item</p></div>
<div class="panel" id="b"><p class="item">Second item</p></div>
<p id="output" aria-live="polite"></p>
<script>
$(function () {
const $result = $(".panel").find(".item").addBack(".selected");
$result.addClass("marked");
$("#output").text("Selected: " + $result.length);
});
</script>
</body>
</html>
Expected result
Both item paragraphs and the selected panel a are highlighted. Panel b is not added, so the output reads Selected: 3. Removing the argument from .addBack() includes both panels and both paragraphs.
Important details and troubleshooting
- Additional traversal methods change what counts as the previous selection. Call .addBack() at the intended point, or retain the required selection in a variable.
- .end() returns to the previous selection, whereas .addBack() merges it into the current one.
- Creating a new object with $(...) does not retain the earlier object’s traversal stack. Use .add() to combine an independent selection.
Compare the behavior with .add() selection merging, .find() descendant traversal.
jQuery :button Selector: Which Elements Does It Match?
Check how :button treats button elements, ordinary button inputs, and submit or reset inputs, with a working selection example.
jQuery :contains(): Match Elements by Text Content
Explore case-sensitive substring matching, descendant text, and a safer way to handle dynamic search strings without constructing selectors.
jQuery .append(): Insert Content as the Last Child
Add content at the end of an element, compare insertion with moving or cloning nodes, and handle user input as plain text.
jQuery .prepend(): Insert Content as the First Child
Add content at the beginning of an element and understand how existing nodes and multiple destinations affect the result.
jQuery .addClass(): Add One or More CSS Classes
Add one or more classes while preserving existing names, generate classes with a callback, and check why styling may not change.
jQuery .removeClass(): Remove Specific or All Classes
Remove selected class names or clear all classes, while distinguishing class removal from clearing inline styles.
jQuery .addBack(): Include the Previous Traversal Selection
Include the previous traversal collection and understand which elements the optional selector filters.
jQuery .add(): Combine Element Selections
Combine selections without changing the original collection, and distinguish selecting elements from inserting them into the document.