jQuery

Pronunciation: JAY-kweer-ee

Updated October 3, 20262 min read

In short

jQuery is a JavaScript library that made selecting elements, handling events, animating and making AJAX requests easy with one short, cross-browser syntax.

What is jQuery?

In the mid-2000s, browsers disagreed on how to do basic things, and the same script often needed different code for Internet Explorer and Firefox. jQuery, created by John Resig, hid those differences behind a small API built around the $ function: $(".menu").hide() found every element with that class and hid it, in any browser.

Its chained style, $("#form").addClass("active").fadeIn(), plus helpers for events and AJAX, made front-end work far quicker, and thousands of plugins grew around it. For years it was simply how JavaScript was written on the web, and it is still loaded on a large share of websites, often through WordPress themes and older systems.

Browsers later caught up. Standard features such as document.querySelectorAll, classList, fetch and CSS transitions now cover most of what jQuery offered, and frameworks such as React and Vue changed how interfaces are built: instead of changing the page step by step, they render it from data.

A common misconception is that jQuery is dead or that using it is wrong. It is maintained and perfectly fine for adding small interactions to a server-rendered site or keeping an existing codebase running. For new, complex applications, modern browser APIs or a component framework are usually the better fit.

Key takeaways

jQuery is a JavaScript library first released in 2006.
It smoothed over browser differences with the short $ syntax.
It made DOM selection, events, animation and AJAX simple.
Modern browser APIs now cover most of its features.
It is still common on existing sites, but new apps rarely start with it.

Example

The same task in jQuery and in plain JavaScriptjavascript

// jQuery
$(".alert").addClass("visible");
$("#save").on("click", () => {
  $.post("/api/save", { title: $("#title").val() });
});

// Modern browser APIs
document.querySelectorAll(".alert").forEach((el) => el.classList.add("visible"));
document.querySelector("#save").addEventListener("click", () => {
  fetch("/api/save", {
    method: "POST",
    body: new URLSearchParams({ title: document.querySelector("#title").value }),
  });
});

Readers ask

Is jQuery still used?

Yes, on a very large number of existing websites, especially those built on WordPress and other content management systems. New projects use it much less.

Should I learn jQuery?

Learn modern JavaScript and the DOM first. Knowing jQuery's basics helps when maintaining older code, and it is quick to pick up once the fundamentals are clear.

What replaced jQuery?

For small tasks, built-in browser APIs such as querySelector, classList and fetch. For larger interfaces, component frameworks such as React, Vue, Angular and Svelte.