YouTip

* * * ## jQuery Selectors Use our ( to demonstrate 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 whose class is "intro" or "demo" | | ( | $("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. Index starts at 0, so the first element is even (0), the second is odd (1), and so on. | | [:odd]( | $("tr:odd") | All odd <tr> elements. Index starts at Infused, so the first element is even (0), the second is odd (1), and so on. | | | | | | [: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 second child of their parent | | [:nth-last-child(_n_)]( | $("p:nth-last-child(2)") | All <p> elements that are the second child of their parent, counting from the last child | | [:nth-of-type(_n_)]( | $("p:nth-of-type(2)") | All <p> elements that are the second <p> element of their parent | | [:nth-last-of-type(_n_)]( | $("p:nth-last-of-type(2)") | All <p> elements that are the second <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 their parent of its type | | | | | | [parent > child]( | $("div > p") | All <p> elements that are direct children of a <div> element | | ( | $("div p") | All <p> elements that are descendants of a <div> element | | [element + next]( | $("div + p") | The next <p> element immediately following each <div> element | | [element ~ siblings]( | $("div ~ p") | All <p> elements that are siblings of a <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 heading elements <h1>, <h2> ... | | [:animated]( | $(":animated") | All animated elements | | [:focus]( | $(":focus") | The element that currently has focus | | [:contains(_text_)]( | $(":contains('Hello')") | All elements containing the text "Hello" | | [:has(_selector_)]( | $("div:has(p)") | All <div> elements that contain a <p> element inside | | [:empty]( | $(":empty") | All empty elements | | [:parent]( | $(":parent") | Matches all elements that are parents, containing child elements or text. | | [:hidden]( | $("p:hidden") | All hidden <p> elements | | [:visible]( | $("table:visible") | All visible tables | | [:root]( | $(":root") | The root element of the document | | [:lang(_language_)]( | $("p:lang(de)") | All <p> elements with a lang attribute value of "de" | | | | | | []( | $("") | All elements with an href attribute | | []( | $("[href='default.htm']") | All elements with an href attribute whose value equals "default.htm" | | [[_attribute_!=_value_]]( | $("[href!='default.htm']") | All elements with an href attribute whose value is not equal to "default.htm" | | [[_attribute_$=_value_]]( | $("[href$='.jpg']") | All elements with an href attribute whose value ends with ".jpg" | | [[_attribute_|=_value_]]( | $("[title|='Tomorrow']") | All elements with a title attribute whose value equals 'Tomorrow' or starts with 'Tomorrow' followed by a hyphen | | [[_attribute_^=_value_]]( | $("[title^='Tom']") | All elements with a title attribute whose value begins with "Tom" | | [[_attribute_~=_value_]]( | $("[title~='hello']") | All elements with a title attribute whose value contains the word "hello" | | [[_attribute*_=_value_]]( | $("[title*='hello']") | All elements with a title attribute whose value contains the string "hello" | | []( | $( "input[name$='man']" ) | Input elements that have an id attribute and whose name attribute ends with 'man' | | | | | | [:input](https://www.run