SyntaxStudy
Sign Up
jQuery Beginner 8 min read

jQuery Selectors

jQuery Selectors

jQuery uses CSS-style selectors to find HTML elements.

Basic Selectors

$("*")          // all elements
$("p")          // all <p> elements
$("#myId")      // element with id
$(".myClass")   // elements with class
$("p.intro")    // <p> with class intro

Hierarchy

$("div p")      // <p> inside <div>
$("div > p")    // direct child <p> only
$("h1 + p")     // <p> immediately after <h1>
$("h1 ~ p")     // all <p> siblings after <h1>

Attribute Selectors

$("[href]")                  // has href
$("[href='#']")             // href equals #
$("input[type='text']")    // text inputs

jQuery-Specific

$("tr:even"), $("tr:odd")
$("p:first"), $("p:last")
$("input:checked")
$("li:eq(2)")   // third list item
Pro Tip

For performance, prefer ID selectors $("#id") as they use native getElementById.