jQuery Selector Tester

HTML Text to search:
<input id="MyText" type="text" value="Hello World" /> <div id="Div1">Div 1<span>This is a span!<span>Nested Span</span></span></span></div> <div id="MyID">Div 2 <div id="Div3"> Div 3"</div></div> <p id="intro">One</p><p>Two</p><p>Hello</p> <div class="MyClass" xyz="123">My classy div!</div> <input xyz="abc" name="abc" value="yes" lang="en-au"/> <input id="123abc" class="MyClass" lang="en"/> <input id="abc123" /><input id="123abc123" /> <input name="abc" value="Steve Wellens" class="My Class" /> <span>This is a another span!</span> <input id="PCStatus" type="checkbox" checked="yes" /> PC Status <input type="radio" id="MyRadio" value="3" /> <table id="MyTable"> <tr><td>row 0 Column 0</td><td>row 0 Column 1</td><td>row 0 Column 2</td></tr> <tr><td>row 1 Column 0</td><td>row 1 Column 1</td><td>row 1 Column 2</td></tr> <tr><td>row 2 Column 0</td><td>row 2 Column 1</td><td>row 2 Column 2</td></tr> <tr><td>row 3 Column 0</td><td>row 3 Column 1</td><td>row 3 Column 2</td></tr> </table> <select id="MySelect" class="SelectClass"> <option>Item 1</option> <option selected="selected">Item 2</option> <option>Item 3</option> </select>

Search Pattern:

Search Results:
#	id	tagName	className	outerHTML

jQuery Selector Cheat Sheet — Double click a row to apply the selector
Selector	Example $("pattern")	Notes
Basic
Wild Card	*	Returns ALL elements
Element	p	Returns all paragraph elements <p>One</p> <p> Two</p>
ID	#MyID	Returns all elements with id of MyID: <div id="MyID"> </div>
Class	.MyClass	Returns all elements with css class of MyClass: <div class="MyClass"> </div>
Combinations
And	div, span	Returns all div AND span elements. The comma is the AND operator.
Child	div > span	Returns span elements directly inside a div.
Ancestor	div span	Returns all span elements inside a div. The space is the Ancestor operator.
Adjacent Sibling	div + input	Return each input preceded by a div.
General Sibling	span ~ input	Return all inputs preceded by a span.
Attributes
Attribute	[xyz]	Returns all elements with the attribute: <input xyz="abc" /> <div xyz="123" />
Attribute Value	input[xyz=abc]	Returns all input elements with an attribute of xyz and value of abc: <input xyz="abc" />
Attr$	input[id$=abc]	Returns <input id="123abc" /> (ends with)
Attr^	input[id^=abc]	Returns <input id="abc123" /> (starts with)
Attr*	input[id*=abc]	Returns <input id="123abc123" /> (contains)
Multiple	input[name=abc][value=yes]	Returns <input name="abc" value="yes" /> (both attributes/values present)
Missing	input:not([alt])	Returns all input elements MISSING attribute alt
Attr\|	input[lang\|=en]	Return elements with lang "en" AND "en-"
Attr~	input[class~=My]	Return elements with the WHOLE word ""My"
Misc
Checkbox	input[type=checkbox]:checked	Returns all checked checkboxes
Radio Button	input[type=radio]:not(:checked)	Returns all unchecked radio buttons
Selected	#MySelect :selected	Returns all Selected elements from element with id MySelect
Even items	#MyTable tr:even	Returns all even rows (can also use odd). Note: Even/Odd is zero based.
nth-child	#MyTable TR:nth-child(2)	Returns element by position, in this case the 2nd row in the table. Note: nth-position is 1 based.
Contains	p:contains("Hello")	Returns all paragraph elements that contain the text "Hello"