empty()

empty() returns jQuery

Removes all child nodes from the set of matched elements.

Example:

$("p").empty()

HTML:
<p>Hello, <span>Person</span> <a href="#">and person</a></p>

Result:
[ <p></p> ]

remove(String)

remove(String expr) returns jQuery
Removes all matched elements from the DOM. This does NOT remove them from the jQuery object, allowing you to use the matched elements further.

Can be filtered with an optional expressions.

Example:

$("p").remove();

HTML:
<p>Hello</p> how are <p>you?</p>

Result:
how are

prependTo(<Content>)

prependTo(<Content> content) returns jQuery
Prepend all of the matched elements to another, specified, set of elements. This operation is, essentially, the reverse of doing a regular $(A).prepend(B), in that instead of prepending B to A, you're prepending A to B.

Example:

Prepends all paragraphs to the element with the ID "foo"

$("p").prependTo("#foo");

HTML:
<p>I would like to say: </p><div id="foo"><b>Hello</b></div>

Result:
<div id="foo"><p>I would like to say: </p><b>Hello</b></div>

appendTo(<Content>)

appendTo(<Content> content) returns jQuery
Append all of the matched elements to another, specified, set of elements. This operation is, essentially, the reverse of doing a regular $(A).append(B), in that instead of appending B to A, you're appending A to B.

Example:

Appends all paragraphs to the element with the ID "foo"
$("p").appendTo("#foo");

HTML:
<p>I would like to say: </p><div id="foo"></div>

Result:
<div id="foo"><p>I would like to say: </p></div>

prepend(<Content>)

prepend(<Content> content) returns jQuery

Prepend content to the inside of every matched element.

This operation is the best way to insert elements inside, at the beginning, of all matched elements.

Example:

Prepends some HTML to all paragraphs.
$("p").prepend("<b>Hello</b>");

HTML:
<p>I would like to say: </p>

Result:
<p><b>Hello</b>I would like to say: </p>

append(<Content>)

append(<Content> content) returns jQuery

Append content to the inside of every matched element.

This operation is similar to doing an appendChild to all the specified elements, adding them into the document.

Example:

Appends some HTML to all paragraphs.
$("p").append("<b>Hello</b>");

HTML:
<p>I would like to say: </p>

Result:
<p>I would like to say: <b>Hello</b></p>

wrap(Element)

wrap(Element elem) returns jQuery

Wrap all matched elements with a structure of other elements. This wrapping process is most useful for injecting additional stucture into a document, without ruining the original semantic qualities of a document.

This works by going through the first element provided and finding the deepest ancestor element within its structure - it is that element that will en-wrap everything else.

This does not work with elements that contain text. Any necessary text must be added after the wrapping is done.

Example:

$("p").wrap( document.getElementById('content') );

HTML:
<p>Test Paragraph.</p><div id="content"></div>

Result:
<div id="content"><p>Test Paragraph.</p></div>

wrap(String)

wrap(String html) returns jQuery
Wrap all matched elements with a structure of other elements. This wrapping process is most useful for injecting additional stucture into a document, without ruining the original semantic qualities of a document.
This works by going through the first element provided (which is generated, on the fly, from the provided HTML) and finds the deepest ancestor element within its structure - it is that element that will en-wrap everything else.
This does not work with elements that contain text. Any necessary text must be added after the wrapping is done.

Example:

$("p").wrap("<div class='wrap'></div>");

HTML:
<p>Test Paragraph.</p>

Result:
<div class='wrap'><p>Test Paragraph.</p></div>

toggleClass(String)

toggleClass(String class) returns jQuery

Adds the specified class if it is not present, removes it if it is present.

Example:

$("p").toggleClass("selected")

HTML:
<p>Hello</p><p class="selected">Hello Again</p>

Result:
[ <p class="selected">Hello</p>, <p>Hello Again</p> ]

removeClass(String)

removeClass(String class) returns jQuery
Removes all or the specified class(es) from the set of matched elements.

Example:

<div class="codeview">
$(&quot;p&quot;).removeClass()

HTML:
&lt;p class=&quot;selected&quot;&gt;Hello&lt;/p&gt;

Result:
[ &lt;p&gt;Hello&lt;/p&gt; ]
</div>

addClass(String)

addClass(String class) returns jQuery
Adds the specified class(es) to each of the set of matched elements.

Example:

$("p").addClass("selected")

HTML:
<p>Hello</p>

Result:
[ <p class="selected">Hello</p> ]

removeAttr(String)

removeAttr(String name) returns jQuery
Remove an attribute from each of the matched elements.

Example:

$("input").removeAttr("disabled")
HTML:
<input disabled="disabled"/>
Result:
<input/>

html(String)

html(String val) returns jQuery

Set the html contents of every matched element. This property is not available on XML documents.

Example:

$("div").html("<b>new stuff</b>");
HTML:
<div><input/></div>
Result:
<div><b>new stuff</b></div>

html()

html() returns String
Get the html contents of the first matched element. This property is not available on XML documents.

Example:

$("div").html();
HTML:
<div><input/></div>
Result:
<input/>

val(String)

val(String val) returns jQuery
Set the value attribute of every matched element.

Example:

$("input").val("test");
HTML:
<input type="text" value="some text"/>
Result:
<input type="text" value="test"/>

val()

val() returns String
Get the content of the value attribute of the first matched element.
Use caution when relying on this function to check the value of multiple-select elements and checkboxes in a form. While it will still work as intended, it may not accurately represent the value the server will receive because these elements may send an array of values.

Example:

$("input").val();
HTML:
<input type="text" value="some text"/>
Result:
"some text"

attr(String,Function)

attr(String key, Function value) returns jQuery
Set a single property to a computed value, on all matched elements. Instead of supplying a string value as described

[[DOM/Attributes#attr.28_key.2C_value_.29|above]], a function is provided that computes the value.

Example:

Sets title attribute from src attribute.

$("img").attr("title", function() { return this.src });
HTML:
<img src="test.jpg" />
Result:
<img src="test.jpg" title="test.jpg" />

attr(String,Object)

attr(String key, Object value) returns jQuery
Set a single property to a value, on all matched elements.
Note that you can't set the name property of input elements in IE. Use $(html) or .append(html) or .html(html) to create elements on the fly including the name property.

Example:

Sets src attribute to all images.
$("img").attr("src","test.jpg");
HTML:
<img/>
Result:
<img src="test.jpg"/>

attr(Map)

attr(Map properties) returns jQuery
Set a key/value object as properties to all matched elements. This serves as the best way to set a large number of properties on all matched elements.

Example:

Sets src and alt attributes to all images.
$("img").attr({ src: "test.jpg", alt: "Test Image" });
HTML:

Result:

attr(String)

attr(String name) returns Object

Access a property on the first matched element. This method makes it easy to retrieve a property value from the first matched element.

If the element does not have an attribute with such a name, undefined is returned.


Example:

Returns the src attribute from the first image in the document.
$("img").attr("src");
HTML:
<img src="test.jpg"/>
Result:
test.jpg

eq(Number)

eq(Number pos) returns jQuery
Reduce the set of matched elements to a single element. The position of the element in the set of
matched elements starts at 0 and goes to length - 1.
Example:

$("p").eq(1)
HTML:
<p>This is just a test.</p><p>So is this</p>
Result:
[ <p>So is this</p> ]

$.noConflict()

$.noConflict() returns undefined
Run this function to give control of the $ variable back to whichever library first implemented it.
This helps to make sure that jQuery doesn't conflict with the $ object of other libraries.
By using this function, you will only be able to access jQuery using the 'jQuery' variable. For
example, where you used to do $("div p"), you now must do jQuery("div p").
Example:

Maps the original object that was referenced by $ back to $
jQuery.noConflict();
// Do something with jQuery
jQuery("div p").hide();
// Do something with another library's $()
$("content").style.display = 'none';

$.extend(Object)

$.extend(Object prop) returns Object
Extends the jQuery object itself. Can be used to add functions into the jQuery namespace and to [[Plugins/Authoring|add plugin methods]] (plugins).
Example:
Adds two plugin methods.

jQuery.fn.extend({
check: function() {
return this.each(function() { this.checked = true; });
},
uncheck: function() {
return this.each(function() { this.checked = false; });
}
});
$("input[@type=checkbox]").check();
$("input[@type=radio]").uncheck();

index(Element)

index(Element subject) returns Number
Searches every matched element for the object and returns the index of the element, if found, starting with zero. Returns -1 if the object wasn't found.
Example:
Returns the index for the element with ID foobar

$("*").index( $('#foobar')[0] )

HTML:

<div id="foobar"><b></b><span id="foo"></span></div>

Result:

0

each(Function)

each(Function fn) returns jQuery
Execute a function within the context of every matched element. This means that every time the passed-in function is executed (which is once for every element matched) the 'this' keyword points
to the specific DOM element.

Additionally, the function, when executed, is passed a single argument representing the position of the element in the matched set (integer, zero-index).
Example:
Iterates over two images and sets their src property

$("img").each(function(i){
this.src = "test" + i + ".jpg";
});

HTML:

<img/><img/>

Result:

<img src="test0.jpg"/><img src="test1.jpg"/>

get(Number)

get(Number num) returns Element
Access a single matched DOM element at a specified index in the matched set. This allows you to extract the actual DOM element and operate on it directly without necessarily using jQuery functionality on it.
Example:
Selects all images in the document and returns the first one

$("img").get(0);

HTML:

<img src="test1.jpg"/> <img src="test2.jpg"/>

Result:

<img src="test1.jpg"/>

length()

length() returns Number
The number of elements currently matched. The size function will return the same value.
Example:

$("img").length;

HTML:

<img src="test1.jpg"/> <img src="test2.jpg"/>

Result:

2

$(Function)

$(Function fn) returns jQuery
A shorthand for $(document).ready(), allowing you to bind a function to be executed when the DOM document has finished loading. This function behaves just like $(document).ready(), in that it should be used to wrap other $() operations on your page that depend on the DOM being ready to be operated on.

You can have as many $(document).ready events on your page as you like.

Example:
Executes the function when the DOM is ready to be used.

$(function(){
// Document is ready
});

Example:
Uses both the shortcut for $(document).ready() and the argument to write failsafe jQuery code
using the $ alias, without relying on the global alias.

jQuery(function($) {
// Your code using failsafe $ alias here...
});

$(String)

$(String html) returns jQuery

Create DOM elements on-the-fly from the provided String of raw HTML.

Example:
Creates a div element (and all of its contents) dynamically, and appends it to the body element.

Internally, an element is created and its innerHTML property set to the given markup. It is therefore both quite flexible and limited.

$("<div><p>Hello</p></div>").appendTo("body")

$(String,Element|jQuery)

$(String expr, Element|jQuery context) returns jQuery

This function accepts a string containing a CSS or basic XPath selector which is then used to match a set of elements.

Example:
Finds all p elements that are children of a div element.

$("div > p")

HTML:

<p>one</p> <div><p>two</p></div> <p>three</p>

Result:

<pre>[ <p>two</p> ]</pre>