jQuery jQuery.sub() Method

What You’ll Learn

jQuery.sub() created a writable copy of jQuery so you could add or override methods without changing the global $. This tutorial covers the official use cases, why it was not a sandbox, why it was removed in 1.9, and what to use instead — with five legacy labs on jQuery 1.8.3.

Introduction

Plugin authors sometimes need helper methods that must not appear on the global jQuery.fn, or they want to override .remove() / .html() only inside a controlled copy of jQuery. Before ES modules were common, jQuery.sub() offered that fork.

Added in jQuery 1.5, jQuery.sub() returns a new jQuery constructor. Methods you add to sub$.fn stay on that copy. The original jQuery / $ remains unchanged for the rest of the page.

The API was deprecated in 1.7 and removed in 1.9. Modern projects should not call $.sub(). This page teaches it so you can read legacy plugins and migrate to modules or the widget factory. See the Utilities hub for current helpers.

Understanding the jQuery.sub() Method

jQuery.sub() takes no arguments. It returns a function that behaves like jQuery for selecting and chaining, but you can freely assign new properties on that function and on its .fn prototype.

Important limitation from the official docs: sub() is not isolation. Events, Ajax, and element data still use the main jQuery. Only the jQuery object you extend is a separate copy.

📝 Syntax

Create a private jQuery copy (jQuery 1.5–1.8 only):

jQuery.sub()
// or
$.sub()

Parameters

• None — the method accepts no arguments.

Return value

• A new jQuery constructor function (same shape as jQuery / $).
• Extend it with sub$.fn.myMethod = … or sub$.fn.extend({ … }).

Official starter pattern

(function() {
  var sub$ = jQuery.sub();
  sub$.fn.myCustomMethod = function() {
    return "just for me";
  };
  sub$( document ).ready(function() {
    sub$( "body" ).myCustomMethod(); // "just for me"
  });
})();
// jQuery( "body" ).myCustomMethod → undefined on the global $

Examples Gallery

Examples follow the official jQuery API documentation. Labs use jQuery 1.8.3 because $.sub() does not exist in 1.9+.

(function() {
  var sub$ = jQuery.sub();
  sub$.fn.myCustomMethod = function() {
    return "just for me";
  };
  sub$( document ).ready(function() {
    sub$( "body" ).myCustomMethod(); // "just for me"
  });
})();
typeof jQuery( "body" ).myCustomMethod; // undefined

sub$("body").myCustomMethod() → "just for me"
typeof jQuery("body").myCustomMethod → "undefined"

Private helper stays off the global jQuery.fn

(function() {
  var myjQuery = jQuery.sub();
  myjQuery.fn.remove = function() {
    this.trigger( "remove" );
    return jQuery.fn.remove.apply( this, arguments );
  };
  myjQuery(function( $ ) {
    $( ".menu" ).on( "click", function() {
      $( this ).find( ".submenu" ).remove();
    });
    $( document ).on( "remove", function( event ) {
      $( event.target ).parent().hide();
    });
  });
})();
// Global jQuery.remove does not fire this custom event

Clicking .menu removes .submenu via myjQuery
Custom "remove" event fires only through the sub copy
Global $.fn.remove remains the stock implementation

(function() {
  var plugin = jQuery.sub();
  plugin.fn.extend({
    open: function() { return this.show(); },
    close: function() { return this.hide(); }
  });
  jQuery.fn.myplugin = function() {
    this.addClass( "plugin" );
    return plugin( this );
  };
})();

$( "#main" ).myplugin().open();
// $( "#main" ).open() would fail — open lives only on the plugin copy

#main gets class "plugin"
.myplugin().open() shows the element
typeof $("#main").open === "undefined" on plain $

var sub$ = jQuery.sub();
sub$.fn.secret = function() { return 42; };

typeof sub$.fn.secret;   // "function"
typeof jQuery.fn.secret; // "undefined"

sub$.fn.secret → function
jQuery.fn.secret → undefined

Forking protects the public API surface

// jQuery 3.7.x
typeof jQuery.sub; // "undefined"

// Modern replacement: keep helpers private in a module/IIFE
(function( $ ) {
  function open( $el ) { return $el.show(); }
  $.fn.myplugin = function() {
    return open( this.addClass( "plugin" ) );
  };
})( jQuery );

typeof jQuery.sub → "undefined" (jQuery 3.7.1)
Use closures / modules / widget factory instead

Do not ship new code that depends on $.sub()

🚀 Historical Use Cases

• Private plugin helpers — methods only available on the subbed jQuery.
• Safe method overrides — customize .remove() / .html() without patching the global.
• Chained plugin APIs — return a subbed collection that exposes open / close.
• Reading legacy code — recognize jQuery.sub() in old plugins during upgrades.
• Not for isolation — never treat sub() as a security sandbox or separate event bus.

📝 Notes

• Added in jQuery 1.5; deprecated in 1.7; removed in 1.9.
• Accepts no arguments; returns a jQuery-like constructor.
• Not a sandbox — events, data, and Ajax still use the main jQuery.
• For plugin state and sub-methods today, prefer the jQuery UI widget factory.
• Do not confuse with $.noConflict() (global name management only).
• Try-it labs 1–4 use jQuery 1.8.3; lab 5 uses jQuery 3.7.1 to show removal.

💡 Best Practices