jQuery .andSelf() Method

What You’ll Learn

The .andSelf() method was jQuery’s original name for merging the previous stack selection with the current set. It behaves like .addBack() with no arguments. This tutorial explains legacy syntax for reading old code, shows classic .nextAll() and .find() patterns, and guides migration to .addBack() in jQuery 3.x.

Introduction

jQuery introduced .andSelf() in version 1.2 to solve a common chaining problem: after .find() or .nextAll() narrows a selection, developers often needed the original elements back in the same collection — without starting a new query.

The method merges the previous matched set on jQuery’s internal stack with the current set. In jQuery 1.8 it was deprecated and renamed to .addBack(). In jQuery 3.0 it was removed entirely. You will still encounter .andSelf() in legacy themes and plugins — this page teaches what it does and how to upgrade.

Understanding the .andSelf() Method

.andSelf() takes no arguments and returns a jQuery object containing the union of the current matched elements and the immediately previous set on the traversal stack. Duplicates are removed; results appear in document order when all nodes share one document.

The official jQuery API states it should work identically to .addBack() without a selector. The only modern difference is that .addBack(selector) can filter the merged union — a capability .andSelf() never had.

📝 Syntax

General form of .andSelf:

.andSelf()

Parameters

• None — this method does not accept any arguments.

Return value

• A new jQuery object with the previous stack set united with the current set.

Official jQuery API description

// Legacy (jQuery 1.2–2.x):
$( "li.third-item" ).nextAll().andSelf()
  .css( "background-color", "red" );

// Modern replacement (jQuery 1.8+):
$( "li.third-item" ).nextAll().addBack()
  .css( "background-color", "red" );

Examples Gallery

Examples show legacy .andSelf() syntax alongside modern .addBack() equivalents. Try-it labs use jQuery 2.2.4 where .andSelf() still exists.

// jQuery 1.2–2.x
$( "li.third-item" ).nextAll().andSelf()
  .css( "background-color", "red" );

// jQuery 1.8+ / 3.x — use instead:
$( "li.third-item" ).nextAll().addBack()
  .css( "background-color", "red" );

Items 3, 4, and 5 → red background
Items 1 and 2 → unchanged

// Paragraphs only:
$( "div.panel" ).find( "p" ).addClass( "highlight" );

// Div AND paragraphs (legacy):
$( "div.panel" ).find( "p" ).andSelf().addClass( "highlight" );

// Modern equivalent:
$( "div.panel" ).find( "p" ).addBack().addClass( "highlight" );

Without andSelf: only p elements highlighted.
With andSelf / addBack: div.panel and its p children highlighted.

// Before (breaks on jQuery 3):
$( ".menu" ).find( "li.active" ).andSelf().slideDown();

// After (jQuery 1.8+ through 3.x):
$( ".menu" ).find( "li.active" ).addBack().slideDown();

// Need a filter? andSelf never supported this — use addBack:
$( ".menu" ).find( "li" ).addBack( ".menu" ).addClass( "open" );

addBack() chain runs on jQuery 3.7+
andSelf() would throw: $(...).andSelf is not a function

// andSelf → 3 elements (items 3, 4, 5)
$( "li.third-item" ).nextAll().andSelf().length;

// end → 1 element (item 3 only)
$( "li.third-item" ).nextAll().end().length;

andSelf().length → 3
end().length → 1

// Typical 2012-era plugin pattern:
$.fn.highlightSection = function () {
  return this.find( ".content" )
    .andSelf()  // ← merge wrapper + .content nodes
    .addClass( "section-active" );
};

// Modern rewrite for jQuery 3:
$.fn.highlightSection = function () {
  return this.find( ".content" )
    .addBack()
    .addClass( "section-active" );
};

Both versions add "section-active" to the plugin root AND .content descendants.

🚀 Common Use Cases

• Legacy maintenance — read and debug old jQuery 1.x/2.x theme code.
• jQuery 3 migration — find .andSelf() calls before upgrading.
• Stack Overflow archaeology — translate decade-old answers to modern syntax.
• Plugin upgrades — rename to .addBack() in custom extensions.
• WordPress themes — many bundled scripts still reference .andSelf().
• Training teams — explain why .addBack() exists and what it replaced.

📝 Notes

• Available jQuery 1.2 through 2.x; deprecated in 1.8; removed in 3.0.
• Identical to .addBack() with no selector argument.
• Does not accept parameters — use .addBack(selector) for filtered merges.
• Calling .andSelf() on jQuery 3.x throws because the method is undefined.
• jQuery Migrate plugin may restore .andSelf() temporarily during upgrades — still replace in source.
• For new development, read the .addBack() tutorial instead.

💡 Best Practices