What is jQuery?

A tiny, cross-browser JavaScript library that makes DOM work one-liners.

Visual explanation diagram · click steps to walk through it

Definition

jQuery is a small, fast, cross-browser JavaScript library — roughly 30 kB minified — whose whole purpose is to make the common things you do on a web page ridiculously easy. Selecting elements, reacting to clicks, animating, loading data from a server, manipulating the DOM — jQuery turns each of these into a single line of readable code that works identically across every modern browser. Its famous slogan is "Write less, do more."

The Problem jQuery Solves

Back in 2006, writing JavaScript that worked across IE6, Firefox, and Safari meant hundreds of lines of browser detection and workarounds. jQuery bundled all of those fixes into one library and exposed a single, friendly API. A task that required 20 lines of vanilla JS (attaching a handler, checking browser quirks, walking the DOM) became one readable line: $('.btn').on('click', doSomething).

What jQuery Gives You

Area	One-liner
DOM selection	`$('.card')`
Event handling	`$('#btn').on('click', fn)`
Animation	`$('#box').fadeIn(300)`
AJAX	`$.get('/api/data', render)`
HTML update	`$('#out').html('<b>Hi</b>')`
Traversal	`$('li.done').parent().siblings()`

Is jQuery Still Relevant in 2026?

Yes — for three reasons:

Legacy codebases. Millions of pages (WordPress sites, Bootstrap 4 projects, Drupal, Magento) still ship jQuery. Being fluent means you can ship fixes fast.
Small interactive pages. For a simple marketing page, jQuery is 30 kB and zero build step — cheaper than installing React.
Plugins. DataTables, Select2, Slick, Magnific Popup — incredible plugin ecosystems still assume jQuery.

A Minimal First Example

html
<!DOCTYPE html>
<html>
  <body>
    <button id="hi">Say hi</button>
    <p id="out"></p>

    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
    <script>
      $(function () {
        $('#hi').on('click', function () {
          $('#out').text('Hello from jQuery!');
        });
      });
    </script>
  </body>
</html>

Key Takeaways

jQuery is a DOM-first JavaScript library — select, update, animate, call the server.
Core promise: 'write less, do more' — every common task collapses to one line.
It normalises browser quirks so the same code runs in every modern browser.
Still widely used in 2026 — WordPress, Bootstrap, and huge legacy codebases rely on it.
Modern alternatives (React, fetch, querySelector) exist — pick the tool that fits the job.

Interview Questions

Practice Questions

Install jQuery via CDN and build a one-button page that uses $('#btn').on('click', fn).
Take a 20-line vanilla-JS snippet you've written and rewrite it in jQuery. Count the lines.
Open a WordPress site in DevTools, type $ in the console — confirm jQuery is present and inspect its version.

Pro Tips

Always pin to a specific version in prod — jquery-3.7.1.min.js, not a floating version.
Prefer the slim build if you don't need AJAX or effects — it's ~23 kB.
Open DevTools → Sources and check for $ vs jQuery — some pages no-conflict $ away from you.

AI-powered recap