Advertisement

Google Ad Slot: content-top

jQuery Selectors


jQuery selectors are used to "find" or "select" HTML elements, so you can apply actions to them — like hiding, showing, changing text, animating, and more.


jQuery selectors use the same syntax as CSS selectors, so if you know CSS, this will feel familiar!


All selectors in jQuery start with the dollar sign and parentheses: $().

Basic jQuery Selectors


Selector Type

Description

Example

Element

Selects all <p> elements

Try it yourself

ID

Selects the element with ID myId

Try it yourself

Class

Selects all elements with class myClass

Try it yourself

Universal

Selects all elements

Try it yourself

Group

Selects all<h1> and <p> elements

Try it yourself

Advanced Selectors

Selector

Description

Example

$("p:first")

Selects the first<p> element

Try it yourself

$("p:last")

Selects the last<p> element

Try it yourself

$("li:even")

Selects even-numbered<li> elements

Try it yourself

$("li:odd")

Selects odd-numbered<li> elements

Try it yourself

$("ul li:first")

Selects the first <li> element of the first <ul>

Try it yourself

$("ul li:first-child")

Selects the first <li> element of every <ul>

Try it yourself

$("[href]")

Selects elements with an href attribute

Try it yourself

$("[href='#']")

Selects elements with href="#"

Try it yourself

$("[href^='https']")

hrefstarts withhttps

Try it yourself

$("[href$='.com']")

hrefends with.com

Try it yourself