jQuery Tutorial

jQuery HomejQuery Basic ProgramjQuery ready()jQuery noConflict()jQuery globalEval()jQuery trim()jQuery type()jQuery length

jQuery Methods

jQuery Callback MethodsjQuery Deferred MethodsjQuery Selector MethodsjQuery MouseEvent MethodsjQuery KeyboardEvent MethodsjQuery Form MethodsjQuery CSS MethodsjQuery Attribute MethodsjQuery DOM MethodsjQuery Array MethodsjQuery Object MethodsjQuery Effects MethodsjQuery Parser MethodsjQuery Event MethodsjQuery Time MethodsjQuery Check MethodsjQuery Event Handler MethodsjQuery Miscellaneous Methods

jQuery Properties

jQuery Event PropertiesjQuery Effects Properties

jQuery Selectors

jQuery Selectors

jQuery HTTP

LEARN AJAX

jQuery Reference

JS KeycodeMIME TypesASCII Table

jQuery Selectors

Last Updated:

jQuery Selectors

The following are the list of Selectors available in jQuery.

Note: The following selectors are arranged in such a way for easy understanding.

SelectorQuick LookExplanation
#id #point Selects an element with id name 'point' i.e) id="point"
.class .point Selects all element with class name 'point' i.e) class="point"
element h2 Select all <h2> elements
* * Selects all elements
Multiple #id, .class, element Selects the combined results of all the specified selectors.
element element div p Selects all <p> elements inside <div> elements
:button :button Selects all button elements and elements of type button.
:reset :reset Selects all elements of type reset.
:submit :submit Selects all button elements and elements of type submit.
:image :image Selects all elements of type image.
:checkbox :checkbox Selects all elements of type checkbox.
:checked :checked Selects all elements that are checked or selected.
:first :first Selects the first matched DOM element.
:last :last Selects the last matched DOM element.
:eq() p:eq(1) Selects <p> element with the index number 1.
:lt() p:lt(1) Selects all <p> elements with an index number less than 1.
:gt() p:gt(1) Selects all <p> elements with an index number greater than 1.
:even p:even Selects all even <p> elements starts from zero index.
:odd p:odd Selects all odd <p> elements starts from zero index.
:focus input:focus Selects <input> element if it is currently focused.
:header :header Selects all elements that are headers.
:input :input Selects all input, textarea, select and button elements.
:root :root Selects the element that is the root of the document.
:text input:text Selects all <input> elements of type text.
:radio input:radio Selects all <input> elements of type radio
:file :file Selects all <input> elements of type file
:password input:password Selects all <input> elements of type password.
:selected :selected Selects all elements that are selected.
:parent td:parent Selects all <td> elements that have at least one child node (either an element or text).
:empty td:empty Selects all <td> elements that have no children (either an element or text).
:animated div:animated Selects all <div> elements that are currently animated.
:enabled input:enabled Selects all <input> elements that are enabled.
:disabled input:disabled Selects all <input> elements that are disabled.
:visible p:visible Selects all <p> elements that are visible.
:hidden p:hidden Selects all <p> elements that are hidden.
:lang() p:lang('en') Selects all <p> elements that have the specified language (english).
:has p:has(span) Selects all <p> elements which contain one or more <span> elements.
:not p:not(.point) Selects all <p> elements that do not match the given selector (class="point").
:contains() p:contains(fun) Selects all <p> elements that contain the specified text ("fun").
:first-child p:first-child Selects all <p> elements that are the first child of their parent.
:last-child p:last-child Selects all <p> elements that are the last child of their parent.
:first-of-type p:first-of-type Selects all <p> elements those are the first child, of a particular type, of their parent.
:last-of-type p:last-of-type Selects all <p> elements those are the last child, of a particular type, of their parent.
:nth-child() h1:nth-child(1) Selects all first <h1> elements, regardless of type, of their parent.
:nth-last-child() p:nth-last-child(1) Selects all last <p> elements, regardless of type, of their parent.
:nth-of-type() p:nth-of-type(1) Selects all first <p> elements, of a particular type, of their parent.
:nth-last-of-type() p:nth-last-of-type(1) Selects all last <p> elements, of a particular type, of their parent.
:only-of-type p:only-of-type Selects all <p> elements that have no siblings with the same element name.
:only-child p:only-child Selects all <p> elements that are the only child of their parent.
(prev + next) ("h1 + p") Selects all <p> elements that are placed immediately after <h1> elements.
(prev ~ next) ("h1 ~ p") Selects all <p> elements that are placed after <h1> elements
(parent > child) (div > p) Selects only <p> that are direct children of <div>.
[attribute|='value'] [placeholder|='Your'] Selects all elements with a placeholder attribute value starting with "Your-".
[attribute*='value'] [placeholder*='our'] Selects all elements with a placeholder attribute value contains the substring of "our"
[attribute~='value'] [placeholder~='Date'] Selects all elements with a placeholder attribute containing the word "Date".
[attribute='value'] [placeholder='Your Age'] Selects all elements with a placeholder attribute containing the exact word "Your Age".
[attribute!='value'] [placeholder!='Your Age'] Selects all elements with a placeholder attribute does not containing the exact word "Your Age".
[attribute$='value'] [placeholder$='Age'] Selects all elements with a placeholder attribute value ending with "Age".
[attribute^='value'] [placeholder^='Your'] Selects all elements with a placeholder attribute value starting with "Your".
("[attrFilter1][attrFilter2][attrFilterN]") [type='text'][placeholder!='Your Age'] Selects elements that match all of the specified attribute filters.

Share this Page

Meet the Author