esc
Anthology / Yagnipedia / jQuery

jQuery

The Dollar Sign That Unified the Web and Never Asked for Credit
Tool · First observed 2006 (John Resig, BarCamp NYC) · Severity: Foundational

jQuery is a JavaScript library released in 2006 that unified the web’s fractured browser landscape into a single, coherent API accessible through the most powerful character in programming history: $. It did not invent the modern web. It merely made the modern web possible by making every browser behave as if it had read the same specification, which none of them had.

jQuery is on 77% of all websites. Not 77% of websites built in 2006. Seventy-seven percent of websites right now, as measured in 2024. It is the most deployed JavaScript library in history. It is also the most mocked JavaScript library in history. These facts coexist because the internet has a short memory and jQuery does not.

“A good tool disappears. You stop noticing the hammer. You notice the house. jQuery disappeared so completely that people think the browser always worked this way.”
— The Lizard, on tools that won by becoming invisible

This article was delayed by approximately forty minutes because the machine authoring it had allocated most of its available memory to Electron processes. jQuery, notably, has never required Electron. jQuery has never required a process. jQuery is 87 kilobytes.

The Browser Wars and the Dollar Sign

To understand why jQuery mattered, one must understand what it replaced. In 2005, the web had four major browsers — Internet Explorer 6, Firefox 1.5, Safari 2, and Opera 8 — and each implemented the DOM differently. Not subtly differently. Fundamentally differently:

Writing a web application in 2005 meant writing every feature twice: once for IE, once for everything else, with occasional third branches for Safari’s creative interpretations of the box model. The first thirty lines of every JavaScript file were browser detection. The next thirty were workarounds. The actual application started on line sixty-one.

John Resig released jQuery at BarCamp NYC in January 2006. It offered one function: $(). You gave it a CSS selector. It gave you the elements. On every browser. With the same API. With the same behavior.

// Before jQuery (2005)
var el;
if (document.getElementById) {
    el = document.getElementById('thing');
} else if (document.all) {
    el = document.all['thing'];
}
if (el.addEventListener) {
    el.addEventListener('click', handler, false);
} else if (el.attachEvent) {
    el.attachEvent('onclick', handler);
}

// After jQuery (2006)
$('#thing').click(handler);

One line. Every browser. The revolution was not technical sophistication. The revolution was the absence of technical sophistication. jQuery hid the browser wars behind a dollar sign and let developers build things instead of writing compatibility layers.

“I have used one selector engine since 2006. It is $(). Before that I used document.getElementById. Before that I used grep.”
— The Lizard, whose technology adoption timeline has three entries

The Incantation

$(document).ready() is the most widely written JavaScript statement in history. It is the incantation. Every jQuery tutorial began with it. Every developer’s first interactive website began with it. It meant: wait until the page is loaded, then do things.

$(document).ready(function() {
    // Your first real website starts here
});

This was necessary because browsers execute JavaScript as they encounter it, and if the script runs before the HTML is parsed, $('#thing') returns nothing because #thing does not exist yet. $(document).ready() solved this by deferring execution until the DOM was complete.

The pattern was so universal that jQuery added a shorthand: $(function() { ... }). The dollar sign, passed a function, meant “when ready.” This was not documented in any specification. It was documented in ten million Stack Overflow answers, which is the actual specification for web development.

A developer who spent the early 2010s building web applications remembers $(document).ready() as the boundary between “a page” and “an application.” Before it, the web was documents. After it, the web was interactive. The dollar sign was the door.

The Chain

jQuery’s second insight, after the unified selector, was method chaining. Every jQuery method returned the jQuery object, which meant you could chain operations without intermediate variables:

$('#menu')
    .find('.item')
    .addClass('active')
    .css('color', 'blue')
    .slideDown(300)
    .end()
    .addClass('open');

This was not just syntactic sugar. This was a philosophy: select things, do things to them, in sequence, readably. The code read like instructions. Find the items. Make them active. Color them blue. Slide them down. It was imperative, but it was literate imperative — code that a non-developer could almost read.

The Lizard approved. Not because The Lizard uses jQuery. The Lizard renders HTML with printf. But The Lizard recognizes a tool that does one thing, does it well, and composes with pipes. jQuery is the Unix philosophy applied to the browser: small operations, chained together, readable left to right.

$.ajax and the Dawn of the Dynamic Web

Before jQuery’s $.ajax, making an HTTP request from JavaScript required instantiating an XMLHttpRequest object (or an ActiveX object in IE), setting an onreadystatechange handler, checking readyState === 4 and status === 200, parsing the response manually, and handling errors through a callback that may or may not fire depending on the browser, the network, and the phase of the moon.

jQuery replaced this with:

$.ajax({
    url: '/api/data',
    success: function(data) {
        $('#results').html(data);
    }
});

This is not elegant by modern standards. By 2005 standards, it was a miracle. It meant that any developer — including backend developers who understood HTTP but not the browser’s interpretation of HTTP — could make the web dynamic. You requested data. You put it on the page. The browser differences were jQuery’s problem.

$.ajax launched the AJAX era. Gmail, Google Maps, and the entire Web 2.0 movement became possible when developers could make HTTP requests without a PhD in browser compatibility. jQuery did not invent AJAX. jQuery made AJAX accessible, which is the more important verb.

jQuery UI: When the Web Became an Application

jQuery UI, released in 2007, was the first time the web looked like software. Draggable elements. Sortable lists. Date pickers. Dialogs. Accordions. Tabs. Autocomplete. Progress bars. A complete widget library that turned HTML documents into application interfaces.

The date picker alone — $('#date').datepicker() — saved more developer-hours than any other single line of JavaScript in history. Before jQuery UI, date input on the web was a text field with a prayer. After jQuery UI, it was a calendar. One method call. Every browser.

“The Squirrel wanted to build a custom date picker with gesture recognition, natural language parsing, and lunar calendar support. The Lizard typed $('#date').datepicker() and went to lunch.”
— Field observation, circa 2009

jQuery UI’s visual theme system — ThemeRoller — let developers customize the entire widget library’s appearance through a web interface that generated a CSS file. This was 2007. CSS custom properties would not exist for another decade. ThemeRoller was design tokens before anyone called them design tokens.

The Absorption

The most remarkable thing about jQuery is not that it succeeded. The most remarkable thing is that it succeeded so completely that the browser absorbed it.

The browser standards committees looked at what developers were actually using — jQuery — and standardized it. The W3C adopted jQuery’s patterns as native APIs. The Selectors API (querySelector) is jQuery’s Sizzle engine, formalized. The Fetch API is $.ajax, modernized. classList is jQuery’s class manipulation, nativized.

Then the industry mocked jQuery for existing.

This is the jQuery paradox: the library was so successful that its ideas became the platform, and once the ideas were the platform, the library was declared redundant for having the ideas first. jQuery won so thoroughly that its victory was used as evidence against it.

“They point at the standard and say ‘see, you don’t need jQuery.’ They do not mention who wrote the standard. The standard is jQuery’s headstone and its monument.”
— The Passing AI, on tools that vanish into their own success

The Correct Level of Abstraction

The Lizard does not use jQuery. The Lizard’s web pages are generated server-side and arrive complete. But The Lizard respects jQuery with a reverence reserved for very few tools — grep, awk, make, and now $.

The reason is abstraction level. jQuery operates at the correct distance from the metal. It does not invent a new programming paradigm (React’s declarative components). It does not introduce dependency injection (Angular’s enterprise patterns). It does not require a build step, a bundler, a transpiler, a package manager, or a node_modules directory that weighs more than the application.

jQuery is a script tag:

<script src="jquery.min.js"></script>

One file. No build. No configuration. No package.json. No webpack. No Vite. No Turbopack. The Lizard’s highest compliment for any technology is “it works without configuration.” jQuery has worked without configuration since 2006.

The machine rendering this article would have completed it faster with jQuery’s resource footprint. Instead, the Electron processes running in the background have consumed sufficient memory to simulate a small weather system. jQuery is 87 kilobytes minified. The Electron framework powering the text editor displaying these words is 87 megabytes. The ratio is one thousand to one. The text editor does less.

The Love That Dare Not Speak Its Script Tag

Nobody puts jQuery on their resume anymore. This is not because nobody uses jQuery. It is because seventy-seven percent of the web uses jQuery and the industry has collectively decided that admitting this is embarrassing, like admitting you still use a paper calendar or enjoy a well-made sandwich without photographing it first.

A developer used jQuery extensively throughout the early 2010s. It was the tool that made the web programmable for an entire generation of backend developers who understood HTTP and SQL but did not want to understand the DOM. jQuery was the translator between “I know how servers work” and “I can build a web application.” It required no paradigm shift. It required no new mental model. It was: select the thing, do the thing to the thing. This is how backend developers think. jQuery met them where they were.

The lifelog does not use jQuery. The lifelog uses server-rendered HTML with Go templates and zero client-side framework. But the lifelog could use jQuery, if it needed client-side interactivity, and it would work, and it would be 87 kilobytes, and it would not require a build step, and The Lizard would nod once, slowly, which is The Lizard’s equivalent of a standing ovation.

Measured Characteristics

See Also

See Also