jQuery Ref Selectors

The use of jQuery Selectors Tester to demonstrate the different selectors

Selector	Example	Selects
*	$("*")	All elements
#id	$("#lastname")	The element with id="lastname"
.class	$(".intro")	All elements with class="intro"
.class,.class	$(".intro,.demo")	All elements with the class "intro" or "demo"
element	$("p")	All <p> elements
el1,el2,el3	$("h1,div,p")	All <h1>, <div> and <p> elements

:first	$("p:first")	The first <p> element
:last	$("p:last")	The last <p> element
:even	$("tr:even")	All even <tr> elements
:odd	$("tr:odd")	All odd <tr> elements

:first-child	$("p:first-child")	All <p> elements that are the first child of their parent
:first-of-type	$("p:first-of-type")	All <p> elements that are the first <p> element of their parent
:last-child	$("p:last-child")	All <p> elements that are the last child of their parent
:last-of-type	$("p:last-of-type")	All <p> elements that are the last <p> element of their parent
:nth-child(n)	$("p:nth-child(2)")	All <p> elements that are the 2nd child of their parent
:nth-last-child(n)	$("p:nth-last-child(2)")	All <p> elements that are the 2nd child of their parent, counting from the last child
:nth-of-type(n)	$("p:nth-of-type(2)")	All <p> elements that are the 2nd <p> element of their parent
:nth-last-of-type(n)	$("p:nth-last-of-type(2)")	All <p> elements that are the 2nd <p> element of their parent, counting from the last child
:only-child	$("p:only-child")	All <p> elements that are the only child of their parent
:only-of-type	$("p:only-of-type")	All <p> elements that are the only child, of its type, of their parent

parent > child	$("div > p")	All <p> elements that are a direct child of a <div> element
parent descendant	$("div p")	All <p> elements that are descendants of a <div> element
element + next	$("div + p")	The <p> element that are next to each <div> elements
element ~ siblings	$("div ~ p")	All <p> elements that appear after the <div> element

:eq(index)	$("ul li:eq(3)")	The fourth element in a list (index starts at 0)
:gt(no)	$("ul li:gt(3)")	List elements with an index greater than 3
:lt(no)	$("ul li:lt(3)")	List elements with an index less than 3
:not(selector)	$("input:not(:empty)")	All input elements that are not empty

:header	$(":header")	All header elements <h1>, <h2> ...
:animated	$(":animated")	All animated elements
:focus	$(":focus")	The element that currently has focus
:contains(text)	$(":contains('Hello')")	All elements which contains the text "Hello"
:has(selector)	$("div:has(p)")	All <div> elements that have a <p> element
:empty	$(":empty")	All elements that are empty
:parent	$(":parent")	All elements that are a parent of another element
:hidden	$("p:hidden")	All hidden <p> elements
:visible	$("table:visible")	All visible tables
:root	$(":root")	The document's root element
:lang(language)	$("p:lang(de)")	All <p> elements with a lang attribute value starting with "de"

[attribute]	$("[href]")	All elements with a href attribute
[attribute=value]	$("[href='default.htm']")	All elements with a href attribute value equal to "default.htm"
[attribute!=value]	$("[href!='default.htm']")	All elements with a href attribute value not equal to "default.htm"
[attribute$=value]	$("[href$='.jpg']")	All elements with a href attribute value ending with ".jpg"
[attribute\|=value]	$("[title\|='Tomorrow']")	All elements with a title attribute value equal to 'Tomorrow', or starting with 'Tomorrow' followed by a hyphen
[attribute^=value]	$("[title^='Tom']")	All elements with a title attribute value starting with "Tom"
[attribute~=value]	$("[title~='hello']")	All elements with a title attribute value containing the specific word "hello"
[attribute=value*]	$("[title*='hello']")	All elements with a title attribute value containing the word "hello"

:input	$(":input")	All input elements
:text	$(":text")	All input elements with type="text"
:password	$(":password")	All input elements with type="password"
:radio	$(":radio")	All input elements with type="radio"
:checkbox	$(":checkbox")	All input elements with type="checkbox"
:submit	$(":submit")	All input elements with type="submit"
:reset	$(":reset")	All input elements with type="reset"
:button	$(":button")	All input elements with type="button"
:image	$(":image")	All input elements with type="image"
:file	$(":file")	All input elements with type="file"
:enabled	$(":enabled")	All enabled input elements
:disabled	$(":disabled")	All disabled input elements
:selected	$(":selected")	All selected input elements
:checked	$(":checked")	All checked input elements

jQuery * Seletor

The * selector selects all elements in the document, including html, head and body.

If the * selector is used together with another element, it selects all child elements within the specified element.

number

Syntax:

$("*")

Tip : The * selector can be heavy to process for some browsers.

Example

Select all elements inside the document:

$("*")

Try it Yourself

jQuery #id Seletor

The #id selector selects the element with the specific id.

The id refers to the id attribute of an HTML element.

Note: The id attribute must be unique within a document.
Do not start an id attribute with a number. It may cause problems in some browsers.

Syntax:

$("#id")

Parameter	Description
id	Required. Specifies the id of the element to select

Example

Select the element with the id "intro":

$("#intro")

Try it Yourself

jQuery .class Seletor

The .class selector selects all elements with the specific class.

The class refers to the class attribute of an HTML element.

The class attribute is used to set a particular style for several HTML elements.

Note: Do not start a class attribute with a number. It may cause problems in some browsers.

Syntax:

$(".class")

Parameter	Description
class	Required. Specifies the class of the elements to select

Example

Select all elements with class "intro":

$(".intro")

Try it Yourself

jQuery .class,.class Seletor

The .class selector can also be used to select multiple classes.

Note: Seperate each class with a comma.
Do not start a class attribute with a number. It may cause problems in some browsers.

Parameter	Description
class	Required. Specifies the class of the elements to select

Syntax:

$(".class1,.class2,.class3,...")

Example

Select all elements with class "intro", "demo" or "end":

$(".intro, .demo, .end")

Try it Yourself

jQuery element Seletor

The element selector selects all elements with the specific element name.

Syntax:

$("element")

Parameter	Description
element	Required. Specifies the element to select

Example

Select all <p> elements:

$("p")

Try it Yourself

jQuery el1,el2,el3 Seletor

The element selector can also be used to select multiple elements.

Note: Seperate each element with a comma.

Syntax:

$("element1,element2,element3,...")

Parameter	Description
element	Required. Specifies the elements to be selected

Example

Select all <h2>, <div> and <span> elements:

$("h2, div, span")

Try it Yourself

jQuery :first Seletor

The :first selector selects the first element.

This is mostly used together with another selector to select the first element in a group (like in the example above).

Note: This selector can only select one single element. Use the :first-child selector to select more than one element (one for each parent).

Syntax:

$(":first")

Example

Select the first <p> element:

$("p:first")

Try it Yourself

jQuery :last Seletor

The :last selector selects the last element.

This is mostly used together with another selector to select the last element in a group (like in the example above).

Note: This selector can only select one single element. Use the :last-child selector to select more than one element (one for each parent).

Syntax:

$(":last")

Example

Select the last <p> element:

$("p:last")

Try it Yourself

jQuery :even Seletor

The :even selector selects each element with an even index number (like: 0, 2, 4, etc.).

The index numbers start at 0.

This is mostly used together with another selector to select every even indexed element in a group (like in the example above).

Syntax:

$(":even")

Example

Select every other (even) <tr> element:

$("tr:even")

Try it Yourself

jQuery :odd Seletor

The :odd selector selects each element with an odd index number (like: 1, 3, 5, etc.).

The index numbers start at 0.

This is mostly used together with another selector to select every odd indexed element in a group (like in the example above).

Syntax:

$(":odd")

Example

Select every other (odd) <tr> element:

$("tr:odd")

Try it Yourself

jQuery :first-child Seletor

The :first-child selector selects all elements that are the first child of their parent.

Syntax:

$(":first-child")

Example

Select every <p> element that is the first child of its parent:

$("p:first-child")

Try it Yourself

jQuery :first-of-type Seletor

The :first-of-type selector selects all elements that are the first child, of a particular type, of their parent.

This is the same as :nth-of-type(1).

Use the :last-of-type selector to select all elements that are the last child, of a particular type, of their parent.

Syntax:

$(":first-of-type")

Example

Select every <p> element that is the first <p> element of its parent:

$("p:first-of-type")

Try it Yourself

jQuery :last-child Seletor

The :last-child selector selects all elements that are the last child of their parent.

Use the :first-child selector to select elements that are the first child of their parent.

Syntax:

$(":last-child")

Example

Select every <p> element that is the last child of its parent:

$("p:last-child")

Try it Yourself

jQuery :last-of-type Seletor

The :last-of-type selector selects all elements that are the last child, of a particular type, of their parent.

Syntax:

$(":last-of-type")

Example

Select every <p> element that is the last <p> element of its parent:

$("p:last-of-type")

Try it Yourself

jQuery :nth-child(n) Seletor

The :nth-child(n) selector selects all elements that are the nth child, regardless of type, of their parent.

Note: Use the :nth-of-type() selector to select all elements that are the nth child, of a particular type, of their parent.

Syntax:

:nth-child(n|even|odd|formula)

Parameter	Description
n	The index of each child to match. Must be a number. The first element has the index number 1.
even	Selects each even child element
odd	Selects each odd child element
formula	Specifies which child element(s) to be selected with a formula (an + b). Example: p:nth-child(3n+2) selects each 3rd paragraph, starting at the 2nd child element

Example

Select each <p> element that is the third child of its parent:

$("p:nth-child(3)")

Try it Yourself

jQuery :nth-last-child(n) Seletor

The :nth-last-child(n) selector selects all elements that are the nth child, regardless of type, of their parent, counting from the last child.

Note: Use the :nth-last-of-type() selector to select all elements that are the nth child, of a particular type, of their parent, counting from the last child.

Syntax:

:nth-last-child(n|even|odd|formula)

Parameter	Description
n	The index of each child to match. Must be a number. The first element has the index number 1.
even	Selects each even child element
odd	Selects each odd child element
formula	Specifies which child element(s) to be selected with a formula (an + b). Example: p:nth-last-child(3n+2) selects each 3rd paragraph, starting at the last 2nd child

Example

Select each <p> element that is the third child of its parent, counting from the last child:

$("p:nth-last-child(3)")

Try it Yourself

jQuery :nth-of-type(n) Seletor

The :nth-of-type(n) selector selects all elements that are the nth child, of a particular type, of their parent.

Note: Use the :nth-child() selector to select all elements that are the nth child, regardless of type, of their parent.

Syntax:

:nth-of-type(n|even|odd|formula)

Parameter	Description
n	The index of each child to match. Must be a number. The first element has the index number 1.
even	Selects each even child element
odd	Selects each odd child element
formula	Specifies which child element(s) to be selected with a formula (an + b). Example: p:nth-of-type(3n+2) selects each 3rd paragraph, starting at the 2nd paragraph

Example

Select each <p> element that is the third <p> element of its parent:

$("p:nth-of-type(3)")

Try it Yourself

jQuery :nth-last-of-type(n) Seletor

The :nth-last-of-type(n) selector selects all elements that are the nth child, of a particular type, of their parent, counting from the last child.

Use the :nth-last-child() selector to select all elements that are the nth child, regardless of type, of their parent, counting from the last child.

Syntax:

:nth-last-of-type(n|even|odd|formula)

Parameter	Description
n	The index of each child to match. Must be a number. The first element has the index number 1.
even	Selects each even child element
odd	Selects each odd child element
formula	Specifies which child element(s) to be selected with a formula (an + b). Example: p:nth-last-child(3n+2) selects each 3rd paragraph, starting at the last 2nd paragraph

Example

Select each <p> element that is the third <p> element of its parent, counting from the last child:

$("p:nth-last-of-type(3)")

Try it Yourself

jQuery :only-child Seletor

The :only-child selector selects every element that is the only child of its parent.

Syntax:

$(":only-child")

Example

Select each <p> element that is the only child of its parent:

$("p:only-child")

Try it Yourself

jQuery :only-of-type Seletor

The :only-of-type selector selects every element that is the only child of its type, of its parent.

Syntax:

$(":only-of-type")

Example

Select each <p> element that is the only <p> element of its parent:

$("p:only-of-type")

Try it Yourself

jQuery parent > child Seletor

The ("parent > child") selector selects all elements that are a direct child of the specified element.

Syntax:

("parent > child")

Parameter	Description
parent	Required. Specifies the parent element to be selected
child	Required. Specifies the direct child element (of the specified parent element) to be selected

Example

Select all <span> elements that are a direct child of a <div> element:

$("div > span")

Try it Yourself

jQuery parent descendant Seletor

The ("parent descendant") selector selects all elements that are descendants of a specified element.

A descendant of an element could be a child, grandchild, great-grandchild, etc, of that element.

Syntax:

("parent descendant")

Parameter	Description
parent	Required. Specifies the parent element to be selected
descendant	Required. Specifies the descendant element (of the specified parent element) to be selected

Example

Select all <span> elements that are descendants of a <div> element:

$("div span")

Try it Yourself

jQuery element + next Seletor

The ("element + next") selector selects the "next" element of the specified "element". The "next" element must be placed right after the specified "element" to be selected.

Example: If you have two <p> elements right after a <div> element, this syntax:

$("div + p") - will only select the first <p> element, because it is the next element of the <div> element (the other <p> element will be ignored)

Example: If you have an <h2> element right after a <div> element, and then a <p> element, this syntax:

$("div + p") - will not select the <p> element, because the next element of the <div> element is the <h2> element

Note: Both of the specified elements must share the same parent.

Syntax:

("element + next")

Parameter	Description
element	Required. Any valid jQuery selector
next	Required. Specifies the element that should be the next element of the element parameter

Example

Select the <p> element that are next to each <div> element:

$("div + p")

Try it Yourself

jQuery element ~ siblings Seletor

The ("element ~ siblings") selector selects sibling elements that appear after the specified "element".

Both of the specified elements must share the same parent.

Syntax:

("element ~ siblings")

Parameter	Description
element	Required. Any valid jQuery selector
siblings	Required. Specifies the siblings of the element parameter

Example

Select all <p> elements that are siblings and appear after the <div> element:

$("div ~ p")

Try it Yourself

jQuery :eq(index) Seletor

The :eq() selector selects an element with a specific index number.

The index numbers start at 0, so the first element will have the index number 0 (not 1).

This is mostly used together with another selector to select a specifically indexed element in a group (like in the example above).

Syntax:

$(":eq(index)")

Parameter	Description
index	Required. Specifies the index of the element

Example

Select the second <p> element:

$("p:eq(1)")

Try it Yourself

jQuery :gt(no) Seletor

The :gt() selector selects elements with an index number higher than a specified number.

The index numbers start at 0.

This is mostly used together with another selector to select the last elements in a group (like in the example above)

Syntax:

$(":gt(index)")

Parameter	Description
index	Required. Specifies which element to select. Elements with an index higher than the specified number is selected.

Example

Select all <tr> elements after the 4 first:

$("tr:gt(3)")

Try it Yourself

jQuery :lt(no) Seletor

The :lt() selector selects elements with an index number less than a specified number.

The index numbers start at 0.

This is mostly used together with another selector to select the first elements in a group (like in the example above).

Syntax:

$(":lt(index)")

Parameter	Description
index	Required. Specifies which element to select. Elements with an index lesser than the specified number is selected.

Example

Select the 4 first <tr> elements:

$("tr:lt(4)")

Try it Yourself

jQuery :not(selector) Seletor

The :not() selector selects all elements except the specified element.

This is mostly used together with another selector to select everything except the specified element in a group (like in the example above).

Syntax:

$(":not(selector)")

Parameter	Description
selector	Required. Specifies the element to not select. This parameter accepts any kind of selector

Example

Select all <p> elements except those with class="intro":

$("p:not(.intro)")

Try it Yourself

jQuery :header Seletor

The :header selector selects all header elements (<h1> to <h6>).

Syntax:

$(":header")

Example

Select all header elements (h1 to h6):

$(":header")

Try it Yourself

jQuery :animated Seletor

The :animated selector selects all elements that are currently animated.

Syntax:

$(":animated")

Example

Select any element that is currently animated:

$(":animated")

Try it Yourself

jQuery :focus Seletor

The :focus selector selects the element that currently has focus.

This selector is often used with a tag name or another selector, if not, this selector will be the same as ("*:focus").

Syntax:

$(":focus")

Example

Select the element that currently has focus:

$(":focus")

Try it Yourself

jQuery :contains(text) Seletor

The :contains() selector selects elements containing the specified string.

The string can be contained directly in the element as text, or in a child element.

This is mostly used together with another selector to select the elements containing the text in a group (like in the example above).

Syntax:

$(":contains(text)")

Parameter	Description
text	Required. Specifies the text to find

Example

Select all <p> elements containing "is":

$("p:contains(is)")

Try it Yourself

jQuery :has(selector) Seletor

The :has() selector selects all elements that have one or more elements inside of them, that matches the specified selector.

To select an element that have multiple elements inside of it, use comma (see example below).

Syntax:

$(":has(selector)")

Parameter	Description
selector	Required. Specifies the element to select. This parameter accepts any kind of selector

Example

Select all <p> elements that have a <span> element inside of them:

$("p:has(span)")

Try it Yourself

jQuery :empty Seletor

The :empty selector selects empty elements.

An empty element is an element without child elements or text.

Syntax:

$(":empty")

Example

Select all empty elements:

$(":empty")

Try it Yourself

jQuery :parent Seletor

The :parent selector selects all elements that are the parent of another element, including text nodes.

Syntax:

$(":parent")

Example

Select all <td> elements with children, including text:

$("td:parent")

Try it Yourself

jQuery :hidden Seletor

The :hidden selector selects hidden elements.

Hidden elements are elements that are:

Set to display:none
Form elements with type="hidden"
Width and height set to 0
A hidden parent element (this also hides child elements)

Syntax:

$(":hidden")

Example

Show hidden <p> elements:

$("p:hidden").show();

Try it Yourself

jQuery :visible Seletor

The :visible selector selects every element that is currently visible.

Visible elements are elements that are not:

Set to display:none
Form elements with type="hidden"
Width and height set to 0
A hidden parent element (this also hides child elements)

Syntax:

$(":visible")

Example

Select all visible <p> elements:

$("p:visible")

Try it Yourself

jQuery :root Seletor

The :root selector selects the document's root element.

In HTML, the root element is always the <html> element.

Syntax:

$(":root")

Example

Set the background color for the HTML document to yellow:

$(":root").css("background-color", "yellow");

Try it Yourself

jQuery :lang(language) Seletor

The :lang() selector selects all elements with the language attribute starting with a specified value.

Note: The value has to be a whole word, either alone, like lang="en", or followed by a hyphen( - ), like lang="en-us".

Syntax:

$(":lang(language)")

Example

Select all <p> elements with a lang attribute value that starts with "it":

$("p:lang(it)")

Try it Yourself

jQuery [attribute] Seletor

The [attribute] selector selects each element with the specified attribute.

Syntax:

$("[attribute]")

Parameter	Description
attribute	Required. Specifies the attribute to find

Example

Select every element with an id attribute:

$("[id]")

Try it Yourself

jQuery [attribute=value] Seletor

The [attribute=value] selector selects each element with the specified attribute and value.

Syntax:

$("[attribute=value]")

Parameter	Description
attribute	Required. Specifies the attribute to find
value	Required. Specifies the value to find

Example

Select every element containing an id attribute with the value "choose":

$("[id=choose]")

Try it Yourself

jQuery [attribute!=value] Seletor

The [attribute!=value] selector selects each element that does NOT have the specified attribute and value.

Elements with the selected attribute, but with a different value, will be selected.

Syntax:

$("[attribute!='value']")

Parameter	Description
attribute	Required. Specifies the attribute to find
value	Required. Specifies the value to find

Example

Select all <p> elements NOT containing a class attribute with the value "intro":

$("p[class!='intro']")

Try it Yourself

jQuery [attribute$=value] Seletor

The [attribute$=value] selector selects each element with a specific attribute, with a value ending in a specific string.

number

Syntax:

$("[attribute$='value']")

Parameter	Description
attribute	Required. Specifies the attribute to find
value	Required. Specifies the string the value should end with

Example

Select all <a> elements with a href attribute that ends with ".org":

$("a[href$='.org']")

Try it Yourself

jQuery [attribute|=value] Seletor

The [attribute|=value] selector selects each element with a specified attribute, with a value equal to a specified string (like "en") or starting with that string followed by a hyphen (like "en-us").

Syntax:

$("[attribute|='value']")

Parameter	Description
attribute	Required. Specifies the attribute to find
value	Required. Specifies the string the attribute value should start with

Example

Select all <p> elements with a title attribute that starts with the value "Tomorrow":

$("p[title|='Tomorrow']")

Try it Yourself

jQuery [attribute^=value] Seletor

The [attribute^=value] selector selects each element with a specific attribute, with a value beginning in a specific string.

number

Syntax:

$("[attribute^='value']")

Parameter	Description
attribute	Required. Specifies the attribute to find
value	Required. Specifies the string the value should begin with

Example

Select all <input> elements with a name attribute that starts with "nation":

$("input[name^='nation']")

Try it Yourself

jQuery [attribute~=value] Seletor

The [attribute~=value] selector selects each element with a specific attribute, with a value containing a specific string.

The string can contain whitespace.

Syntax:

$("[attribute~='value']")

Parameter	Description
attribute	Required. Specifies the attribute to find
value	Required. Specifies the string value

Example

Select all <input> elements with a name attribute that contains the specific word "nation":

$("input[name~='nation']")

Try it Yourself

jQuery [attribute*=value] Seletor

The [attribute*=value] selector selects each element with a specific attribute, with a value containing a string.

Syntax:

$("[attribute*='value']")

Parameter	Description
attribute	Required. Specifies the attribute to find
value	Required. Specifies the string value

Example

Select all <input> elements with a name attribute that contains the word "nation":

$("input[name*='nation']")

Try it Yourself

jQuery :input Seletor

The :input selector selects form elements.

This selector also works with the button element.

Syntax:

$(":input")

Example

Select all input elements:

$(":input")

Try it Yourself

jQuery :text Seletor

The :text selector selects input elements with type=text.

Syntax:

$(":text")

Example

Select <input> elements with type="text":

$(":text")

Try it Yourself

jQuery :password Seletor

The :password selector selects input elements with type=password.

Syntax:

$(":password")

Example

Select <input> elements with type="password":

$(":password")

Try it Yourself

jQuery :radio Seletor

The :radio selector selects input elements with type=radio.

Syntax:

$(":radio")

Example

Select all <input> elements with type="radio":

$(":radio")

Try it Yourself

jQuery :checkbox Seletor

The :checkbox selector selects input elements with type=checkbox.

Syntax:

$(":checkbox")

Example

Select all <input> elements with type="checkbox":

$(":checkbox")

Try it Yourself

jQuery :submit Seletor

The :submit selector selects button and input elements with type=submit.

If a button element has no defined type, most browsers will use it as a button with type=submit.

Syntax:

$(":submit")

Example

Select <input> and <button> elements with type="submit":

$(":submit")

Try it Yourself

jQuery :reset Seletor

The :reset selector selects button and input elements with type=reset.

Using input:reset as a selector will not select the button element.

Syntax:

$(":reset")

Example

Select <input> and <button> elements with type="reset":

$(":reset")

Try it Yourself

jQuery :button Seletor

The :button selector selects button elements, and input elements with type=button.

Using input:button as a selector will not select the button element.

Example

Select <button> elements and <input> elements with type="button":

$(":button")

Try it Yourself

jQuery :image Seletor

The :image selector selects input elements with type=image.

Syntax:

$(":image")

Example

Select <input> elements with type="image":

$(":image")

Try it Yourself

jQuery :file Seletor

The :file selector selects input elements with type=file.

Syntax:

$(":file")

Example

Select <input> elements with type="file":

$(":file")

Try it Yourself

jQuery :enabled Seletor

The :enabled selector selects all enabled form elements.

Syntax:

$(":enabled")

Example

Select all the enabled form elements:

$(":enabled")

Try it Yourself

jQuery :disabled Seletor

The :disabled selector selects all disabled form elements.

Syntax:

$(":disabled")

Example

Select all the disabled form elements:

$(":disabled")

Try it Yourself

jQuery :selected Seletor

The :selected selector selects option elements that are pre-selected.

Note: This selector will not work on checkboxes or radio buttons. Use the :checked selector instead.

Syntax:

$(":selected")

Example

Select the pre-selected item(s) in a drop-down list:

$(":selected")

Try it Yourself

jQuery :checked Seletor

The :checked selector selects all checked checkboxes or radio buttons.

Syntax:

$(":checked")

Example

Select all checked elements (checkboxes or radio buttons):

$(":checked")

Try it Yourself

We will learn about event references in next chapter Click

<< Prev Next >>

jQuery Basic

jQuery Effects

jQuery manipulation

jQuery advanced

jQuery Exercises

jQuery References

jQuery Ref Selectors

jQuery * Seletor

Syntax:

Example

jQuery #id Seletor

Syntax:

Example

jQuery .class Seletor

Syntax:

Example

jQuery .class,.class Seletor

Syntax:

Example

jQuery element Seletor

Syntax:

Example

jQuery el1,el2,el3 Seletor

Syntax:

Example

jQuery :first Seletor

Syntax:

Example

jQuery :last Seletor

Syntax:

Example

jQuery :even Seletor

Syntax:

Example

jQuery :odd Seletor

Syntax:

Example

jQuery :first-child Seletor

Syntax:

Example

jQuery :first-of-type Seletor

Syntax:

Example

jQuery :last-child Seletor

Syntax:

Example

jQuery :last-of-type Seletor

Syntax:

Example

jQuery :nth-child(n) Seletor

Syntax:

Example

jQuery :nth-last-child(n) Seletor

Syntax:

Example

jQuery :nth-of-type(n) Seletor

Syntax:

Example

jQuery :nth-last-of-type(n) Seletor

Syntax:

Example

jQuery :only-child Seletor

Syntax:

Example

jQuery :only-of-type Seletor

Syntax:

Example

jQuery parent > child Seletor

Syntax:

Example

jQuery parent descendant Seletor

Syntax:

Example

jQuery element + next Seletor

Syntax:

Example

jQuery element ~ siblings Seletor

Syntax:

Example

jQuery :eq(index) Seletor