Selecting elements

Borrowing from CSS 1–3, and then adding its own, jQuery offers a powerful set of tools for matching a set of elements in a document.

To use any of the meta-characters ( such as !"#$%&'()*+,./:;<=>?@[\]^`{|}~ ) as a literal part of a name, it must be escaped with with two backslashes: \\. For example, an element with id="foo.bar", can use the selector $("#foo\\.bar").

All Selector (“*”)

Selects all elements.

:animated Selector

Select all elements that are in the progress of an animation at the time the selector is run.

Attribute Contains Prefix Selector [name|=”value”]

Selects elements that have the specified attribute with a value either equal to a given string or starting with that string followed by a hyphen (-).

Attribute Contains Selector [name*=”value”]

Selects elements that have the specified attribute with a value containing a given substring.

Attribute Contains Word Selector [name~=”value”]

Selects elements that have the specified attribute with a value containing a given word, delimited by spaces.

Attribute Ends With Selector [name$=”value”]

Selects elements that have the specified attribute with a value ending exactly with a given string. The comparison is case sensitive.

Attribute Equals Selector [name=”value”]

Selects elements that have the specified attribute with a value exactly equal to a certain value.

Attribute Not Equal Selector [name!=”value”]

Select elements that either don’t have the specified attribute, or do have the specified attribute but not with a certain value.

Attribute Starts With Selector [name^=”value”]

Selects elements that have the specified attribute with a value beginning exactly with a given string.

:button Selector

Selects all button elements and elements of type button.

:checkbox Selector

Selects all elements of type checkbox.

:checked Selector

Matches all elements that are checked or selected.

Child Selector (“parent > child”)

Selects all direct child elements specified by “child” of elements specified by “parent”.

Class Selector (“.class”)

Selects all elements with the given class.

:contains() Selector

Select all elements that contain the specified text.

Descendant Selector (“ancestor descendant”)

Selects all elements that are descendants of a given ancestor.

:disabled Selector

Selects all elements that are disabled.

Element Selector (“element”)

Selects all elements with the given tag name.

:empty Selector

Select all elements that have no children (including text nodes).

:enabled Selector

Selects all elements that are enabled.

:eq() Selector

Select the element at index n within the matched set.

:even Selector

Selects even elements, zero-indexed. See also odd.

:file Selector

Selects all elements of type file.

:first-child Selector

Selects all elements that are the first child of their parent.

:first-of-type Selector

Selects all elements that are the first among siblings of the same element name.

:first Selector

Selects the first matched DOM element.

:focus Selector

Selects element if it is currently focused.

:gt() Selector

Select all elements at an index greater than index within the matched set.

Has Attribute Selector [name]

Selects elements that have the specified attribute, with any value.

:has() Selector

Selects elements which contain at least one element that matches the specified selector.

:header Selector

Selects all elements that are headers, like h1, h2, h3 and so on.

:hidden Selector

Selects all elements that are hidden.

ID Selector (“#id”)

Selects a single element with the given id attribute.

:image Selector

Selects all elements of type image.

:input Selector

Selects all input, textarea, select and button elements.

:lang() Selector

Selects all elements of the specified language.

:last-child Selector

Selects all elements that are the last child of their parent.

:last-of-type Selector

Selects all elements that are the last among siblings of the same element name.

:last Selector

Selects the last matched element.

:lt() Selector

Select all elements at an index less than index within the matched set.

Multiple Attribute Selector [name=”value”][name2=”value2″]

Matches elements that match all of the specified attribute filters.

Multiple Selector (“selector1, selector2, selectorN”)

Selects the combined results of all the specified selectors.

Next Adjacent Selector (“prev + next”)

Selects all next elements matching “next” that are immediately preceded by a sibling “prev”.

Next Siblings Selector (“prev ~ siblings”)

Selects all sibling elements that follow after the “prev” element, have the same parent, and match the filtering “siblings” selector.

:not() Selector

Selects all elements that do not match the given selector.

:nth-child() Selector

Selects all elements that are the nth-child of their parent.

:nth-last-child() Selector

Selects all elements that are the nth-child of their parent, counting from the last element to the first.

:nth-last-of-type() Selector

Selects all the elements that are the nth-child of their parent in relation to siblings with the same element name, counting from the last element to the first.