Small jQuery Cheat Sheet

I always forget this stuff... is it click() or onclick()? (it's click() in case you're wondering)

Hope this will be helpful to others too.

This is by no means definite or complete guide... well, it's a cheat sheet.

Most of the stuff here is just DOM and events related. AJAX etc. is best described in jQuery docs.

.add()

Add elements to the set of matched elements.

.add( selector )

• selector A string representing a selector expression to find additional elements to add to the set of matched elements.

.add( elements )

• elements One or more elements to add to the set of matched elements.

.add( html )

• html An HTML fragment to add to the set of matched elements.

.add( jQuery object )

• jQuery object An existing jQuery object to add to the set of matched elements.

.add( selector, context )

• selector A string representing a selector expression to find additional elements to add to the set of matched elements.
• context The point in the document at which the selector should begin matching; similar to the context argument of the $(selector, context) method.

.addClass()

Adds the specified class(es) to each of the set of matched elements.

.addClass( className )

• className One or more class names to be added to the class attribute of each matched element.

.addClass( function(index, currentClass) )

• function(index, currentClass) A function returning one or more space-separated class names to be added to the existing class name(s). Receives the index position of the element in the set and the existing class name(s) as arguments. Within the function, this refers to the current element in the set.

.after() and .before()

Insert content, specified by the parameter, after/before each element in the set of matched elements.

.after( content [, content] )
.before( content [, content] )

• content HTML string, DOM element, or jQuery object to insert after/before each element in the set of matched elements.
• content One or more additional DOM elements, arrays of elements, HTML strings, or jQuery objects to insert after/before each element in the set of matched elements.

.after( function(index) )
.before( function )

• function(index) A function that returns an HTML string, DOM element(s), or jQuery object to insert after/before each element in the set of matched elements. Receives the index position of the element in the set as an argument. Within the function, this refers to the current element in the set.

.animate()

Perform a custom animation of a set of CSS properties.

.animate( properties [, duration] [, easing] [, complete] )

• properties A map of CSS properties that the animation will move toward.
• duration A string or number determining how long the animation will run.
• easing A string indicating which easing function to use for the transition.
• complete A function to call once the animation is complete.

.animate( properties, options )

• properties A map of CSS properties that the animation will move toward.
• options A map of additional options to pass to the method. Supported keys:
  • duration: A string or number determining how long the animation will run.
  • easing: A string indicating which easing function to use for the transition.
  • complete: A function to call once the animation is complete.
  • step: A function to be called after each step of the animation.
  • queue: A Boolean indicating whether to place the animation in the effects queue. If false, the animation will begin immediately. As of jQuery 1.7, the queue option can also accept a string, in which case the animation is added to the queue represented by that string.
  • specialEasing: A map of one or more of the CSS properties defined by the properties argument and their corresponding easing functions (added 1.4).

.append() and .prepend()

Insert content, specified by the parameter, to the end/beginning of each element in the set of matched elements.

.append( content [, content] )
.prepend( content [, content] )

• content DOM element, HTML string, or jQuery object to insert at the end/beginning of each element in the set of matched elements.
• content One or more additional DOM elements, arrays of elements, HTML strings, or jQuery objects to insert at the end/beginning of each element in the set of matched elements.

.append( function(index, html) )
.prepend( function(index, html) )

• function(index, html) A function that returns an HTML string, DOM element(s), or jQuery object to insert at the end/beginning of each element in the set of matched elements. Receives the index position of the element in the set and the old HTML value of the element as arguments. Within the function, this refers to the current element in the set.

.appendTo() and .prependTo()

Insert every element in the set of matched elements to the end/beginning of the target.

.appendTo( target )
.prependTo( target )

• target A selector, element, HTML string, or jQuery object; the matched set of elements will be inserted at the end/beginning of the element(s) specified by this parameter.

.attr()

Get the value of an attribute for the first element in the set of matched elements.

.attr( attributeName )

• attributeName The name of the attribute to get.

.attr( attributeName, value )

• attributeName The name of the attribute to set.
• value A value to set for the attribute.

.attr( map )

• map A map of attribute-value pairs to set.

.attr( attributeName, function(index, attr) )

• attributeName The name of the attribute to set.
• function(index, attr) A function returning the value to set. this is the current element. Receives the index position of the element in the set and the old attribute value as arguments.

.children()

Get the children of each element in the set of matched elements, optionally filtered by a selector.

.children( [selector] )

• selector A string containing a selector expression to match elements against.

.clearQueue()

Remove from the queue all items that have not yet been run.

.clearQueue( [queueName] )

• queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.

.click()

Bind an event handler to the "click" JavaScript event, or trigger that event on an element.

.click( handler(eventObject) )

• handler(eventObject) A function to execute each time the event is triggered.

.click( [eventData], handler(eventObject) )

• eventData A map of data that will be passed to the event handler.
• handler(eventObject) A function to execute each time the event is triggered.

.click()

Trigger the "click" event.

.css()

Get the value of a style property for the first element in the set of matched elements.

.css( propertyName )

• propertyName A CSS property.

.css( propertyName, value )

• propertyName A CSS property name.
• value A value to set for the property.

.css( propertyName, function(index, value) )

• propertyName A CSS property name.
• function(index, value) A function returning the value to set. this is the current element. Receives the index position of the element in the set and the old value as arguments.

.css( map )

• map A map of property-value pairs to set.

.dblclick()

Bind an event handler to the "dblclick" JavaScript event, or trigger that event on an element.

.dblclick( handler(eventObject) )

• handler(eventObject) A function to execute each time the event is triggered.

.dblclick( [eventData], handler(eventObject) )

• eventData A map of data that will be passed to the event handler.
• handler(eventObject) A function to execute each time the event is triggered.

.dblclick()

Trigger the "dblclick" event.

.delay()

Set a timer to delay execution of subsequent items in the queue.

.delay( duration [, queueName] )

• duration An integer indicating the number of milliseconds to delay execution of the next item in the queue.
• queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.

.each()

Iterate over a jQuery object, executing a function for each matched element.

.each( function(index, Element) )

• function(index, Element) A function to execute for each matched element.

.fadeIn() and .fadeOut()

Display/Hide the matched elements by fading them to opaque/transparent.

.fadeIn( [duration] [, callback] )
.fadeOut( [duration] [, callback] )

• duration A string or number determining how long the animation will run.
• callback A function to call once the animation is complete.

.fadeIn( [duration] [, easing] [, callback] )
.fadeOut( [duration] [, easing] [, callback] )

• duration A string or number determining how long the animation will run.
• easing A string indicating which easing function to use for the transition.
• callback A function to call once the animation is complete.

.fadeTo()

Adjust the opacity of the matched elements.

.fadeTo( duration, opacity [, callback] )

• duration A string or number determining how long the animation will run.
• opacity A number between 0 and 1 denoting the target opacity.
• callback A function to call once the animation is complete.

.fadeTo( duration, opacity [, easing] [, callback] )

• duration A string or number determining how long the animation will run.
• opacity A number between 0 and 1 denoting the target opacity.
• easing A string indicating which easing function to use for the transition.
• callback A function to call once the animation is complete.

.fadeToggle()

Display or hide the matched elements by animating their opacity.

.fadeToggle( [duration] [, easing] [, callback] )

• duration A string or number determining how long the animation will run.
• easing A string indicating which easing function to use for the transition.
• callback A function to call once the animation is complete.

.filter()

Reduce the set of matched elements to those that match the selector or pass the function's test.

.filter( selector )

• selector A string containing a selector expression to match the current set of elements against.

.filter( function(index) )

• function(index) A function used as a test for each element in the set. Within the function, this is the current DOM element.

.filter( element )

• element An element to match the current set of elements against.

.filter( jQuery object )

• jQuery object An existing jQuery object to match the current set of elements against.

.find()

Get the descendants of each element in the current set of matched elements, filtered by a selector, jQuery object, or element.

.find( selector )

• selector A string containing a selector expression to match elements against.

.find( jQuery object )

• jQuery object A jQuery object to match elements against.

.find( element )

• element An element to match elements against.

.first() and .last()

Reduce the set of matched elements to the first/last in the set.

.focus()

Bind an event handler to the "focus" JavaScript event, or trigger that event on an element.

.focus( handler(eventObject) )

• handler(eventObject) A function to execute each time the event is triggered.

.focus( [eventData], handler(eventObject) )

• eventData A map of data that will be passed to the event handler.
• handler(eventObject) A function to execute each time the event is triggered.

.focus()

Trigger the "focus" event.

.focusin() and .focusout()

Bind an event handler to the "focusin"/"focusout" event.

.focusin( handler(eventObject) )
.focusout( handler(eventObject) )

• handler(eventObject) A function to execute each time the event is triggered.

.focusin( [eventData], handler(eventObject) )
.focusout( [eventData], handler(eventObject) )

• eventData A map of data that will be passed to the event handler.
• handler(eventObject) A function to execute each time the event is triggered.

.height() and .width()

Get the current computed height/width for the first element in the set of matched elements.

.height()
.width()

Get the current computed height/width.

.height( value )
.width( value )

• value An integer representing the number of pixels, or an integer with an optional unit of measure appended (as a string).

.height( function(index, height) )
.width( function(index, height) )

• function(index, height) A function returning the height to set. Receives the index position of the element in the set and the old height as arguments. Within the function, this refers to the current element in the set.

.hide() and .show()

Hide/Display the matched elements.

.hide()
.show()

Hide/Display the matched elements.

.hide( duration [, callback] )
.show( duration [, callback] )

• duration A string or number determining how long the animation will run.
• callback A function to call once the animation is complete.

.hide( [duration] [, easing] [, callback] )
.show( [duration] [, easing] [, callback] )

• duration A string or number determining how long the animation will run.
• easing A string indicating which easing function to use for the transition.
• callback A function to call once the animation is complete.

.hover()

Bind two handlers to the matched elements, to be executed when the mouse pointer enters and leaves the elements.

.hover( handlerIn(eventObject), handlerOut(eventObject) )

• handlerIn(eventObject) A function to execute when the mouse pointer enters the element.
• handlerOut(eventObject) A function to execute when the mouse pointer leaves the element.

.hover( handlerInOut(eventObject) )

• handlerInOut(eventObject) A function to execute when the mouse pointer enters or leaves the element.

.html()

Get the HTML contents of the first element in the set of matched elements.

.html()

Get the HTML contents.

.html( htmlString )

• htmlString A string of HTML to set as the content of each matched element.

.html( function(index, oldhtml) )

• function(index, oldhtml) A function returning the HTML content to set. Receives the index position of the element in the set and the old HTML value as arguments. jQuery empties the element before calling the function; use the oldhtml argument to reference the previous content. Within the function, this refers to the current element in the set.

.innerHeight() and .innerWidth()

Get the current computed height/width for the first element in the set of matched elements, including padding but not border.

.insertAfter() and .insertBefore()

Insert every element in the set of matched elements after/before the target.

.insertAfter( target )
.insertBefore( target )

• target A selector, element, HTML string, or jQuery object; the matched set of elements will be inserted after/before the element(s) specified by this parameter.

.keydown(), .keypress() and .keyup()

Bind an event handler to the "keydown"/"keypress"/"keyup" JavaScript event, or trigger that event on an element.

.keydown( handler(eventObject) )
.keypress( handler(eventObject) )
.keyup( handler(eventObject) )

• handler(eventObject) A function to execute each time the event is triggered.

.keydown( [eventData], handler(eventObject) )
.keypress( [eventData], handler(eventObject) )
.keyup( [eventData], handler(eventObject) )

• eventData A map of data that will be passed to the event handler.
• handler(eventObject) A function to execute each time the event is triggered.

.keydown()
.keypress()
.keyup()

Trigger the "keydown"/"keypress"/"keyup" event.

.load()

Load data from the server and place the returned HTML into the matched element.

.load( url [, data] [, complete(responseText, textStatus, XMLHttpRequest)] )

• url A string containing the URL to which the request is sent.
• data A map or string that is sent to the server with the request.
• complete(responseText, textStatus, XMLHttpRequest) A callback function that is executed when the request completes.

.load()

Bind an event handler to the "load" JavaScript event.

.load( handler(eventObject) )

• handler(eventObject) A function to execute when the event is triggered.

.load( [eventData], handler(eventObject) )

• eventData A map of data that will be passed to the event handler.
• handler(eventObject) A function to execute each time the event is triggered.

.map()

Pass each element in the current matched set through a function, producing a new jQuery object containing the return values.

.map( callback(index, domElement) )
  -- e.g. to get CSV of checkbox ID's:
$(':checkbox').map(function() { return this.id; }).get().join(',');

• callback(index, domElement) A function object that will be invoked for each element in the current set.

.mousedown() and .mouseup()

Bind an event handler to the "mousedown"/"mouseup" JavaScript event, or trigger that event on an element.

.mousedown( handler(eventObject) )
.mouseup( handler(eventObject) )

• handler(eventObject) A function to execute each time the event is triggered.

.mousedown( [eventData], handler(eventObject) )
.mouseup( [eventData], handler(eventObject) )

• eventData A map of data that will be passed to the event handler.
• handler(eventObject) A function to execute each time the event is triggered.

.mousedown()
.mouseup()

Trigger the "mousedown"/"mouseup" event.

.mouseenter(), .mouseleave(), .mousemove(), .mouseout(), and .mouseover()

Bind an event handler to the "mouseenter"/"mouseleave"/"mousemove"/"mouseout"/"mouseover" JavaScript event, or trigger that event on an element.

.mouseenter( handler(eventObject) )
.mouseleave( handler(eventObject) )
.mousemove( handler(eventObject) )
.mouseout( handler(eventObject) )
.mouseover( handler(eventObject) )

• handler(eventObject) A function to execute each time the event is triggered.

.mouseenter( [eventData], handler(eventObject) )
.mouseleave( [eventData], handler(eventObject) )
.mousemove( [eventData], handler(eventObject) )
.mouseout( [eventData], handler(eventObject) )
.mouseover( [eventData], handler(eventObject) )

• eventData A map of data that will be passed to the event handler.
• handler(eventObject) A function to execute each time the event is triggered.

.mouseenter()
.mouseleave()
.mousemove()
.mouseout()
.mouseover()

Trigger the "mousedown"/"mouseup" event.

.next() and .prev()

Get the immediately following/preceding sibling of each element in the set of matched elements. If a selector is provided, it retrieves the next/previous sibling only if it matches that selector.

.next( [selector] )
.prev( [selector] )

• selector A string containing a selector expression to match elements against.

.nextAll() and .prevAll()

Get all following/preceding siblings of each element in the set of matched elements, optionally filtered by a selector.

.nextAll( [selector] )
.prevAll( [selector] )

• selector A string containing a selector expression to match elements against.

.nextUntil() and .prevUntil()

Get all following/preceding siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object passed.

.nextUntil( [selector] [, filter] )
.prevUntil( [selector] [, filter] )

• selector A string containing a selector expression to indicate where to stop matching following sibling elements.
• filter A string containing a selector expression to match elements against.

.nextUntil( [element] [, filter] )
.prevUntil( [element] [, filter] )

• element A DOM node or jQuery object indicating where to stop matching following sibling elements.
• filter A string containing a selector expression to match elements against.

.offset()

Get the current coordinates of the first element in the set of matched elements, relative to the document. See also .position().

.offset()

Returns an object containing the properties top and left.

.offset( coordinates )

• coordinates An object containing the properties top and left, which are integers indicating the new top and left coordinates for the elements.

.offset( function(index, coords) )

• function(index, coords) A function to return the coordinates to set. Receives the index of the element in the collection as the first argument and the current coordinates as the second argument. The function should return an object with the new top and left properties.

.outerHeight() and .outerWidth()

Get the current computed height/width for the first element in the set of matched elements, including padding, border, and optionally margin. Returns an integer (without "px") representation of the value or null if called on an empty set of elements.

.outerHeight( [includeMargin] )
.outerWidth( [includeMargin] )

• includeMargin A Boolean indicating whether to include the element's margin in the calculation.

.parent()

Get the parent of each element in the current set of matched elements, optionally filtered by a selector.

.parent( [selector] )

• selector A string containing a selector expression to match elements against.

.parents()

Get the ancestors of each element in the current set of matched elements, optionally filtered by a selector.

.parents( [selector] )

• selector A string containing a selector expression to match elements against.

.position()

Get the current coordinates of the first element in the set of matched elements, relative to the offset parent. Returns an object containing the properties top and left. See also .offset().

.remove()

Remove the set of matched elements from the DOM.

.remove( [selector] )

• selector A selector expression that filters the set of matched elements to be removed.

.removeAttr()

Remove an attribute from each element in the set of matched elements.

.removeAttr( attributeName )

• attributeName An attribute to remove; as of version 1.7, it can be a space-separated list of attributes.

.removeClass()

Remove a single class, multiple classes, or all classes from each element in the set of matched elements.

.removeClass( [className] )

• className One or more space-separated classes to be removed from the class attribute of each matched element.

.removeClass( function(index, class) )

• function(index, class) A function returning one or more space-separated class names to be removed. Receives the index position of the element in the set and the old class value as arguments.

.resize()

Bind an event handler to the "resize" JavaScript event, or trigger that event on an element.

.resize( handler(eventObject) )

• handler(eventObject) A function to execute each time the event is triggered.

.resize( [eventData], handler(eventObject) )

• eventData A map of data that will be passed to the event handler.
• handler(eventObject) A function to execute each time the event is triggered.

.resize()

Trigger the "resize" event.

.scroll()

Bind an event handler to the "scroll" JavaScript event, or trigger that event on an element.

.scroll( handler(eventObject) )

• handler(eventObject) A function to execute each time the event is triggered.

.scroll( [eventData], handler(eventObject) )

• eventData A map of data that will be passed to the event handler.
• handler(eventObject) A function to execute each time the event is triggered.

.scroll()

Trigger the "scroll" event.

.scrollLeft() and .scrollTop()

Get the current horizontal/vertical position of the scroll bar for the first element in the set of matched elements.

.scrollLeft()
.scrollTop()

Get the position.

.scrollLeft( value )
.scrollTop( value )

• value An integer indicating the new position to set the scroll bar to.

.select()

Bind an event handler to the "select" JavaScript event, or trigger that event on an element.

.select( handler(eventObject) )

• handler(eventObject) A function to execute each time the event is triggered.

.select( [eventData], handler(eventObject) )

• eventData A map of data that will be passed to the event handler.
• handler(eventObject) A function to execute each time the event is triggered.

.select()

Trigger the "select" event.

.siblings()

Get the siblings of each element in the set of matched elements, optionally filtered by a selector.

.siblings( [selector] )

• selector A string containing a selector expression to match elements against.

.slideDown(), .slideUp() and .slideToggle()

Display/Hide or toggle the matched elements with a sliding motion.

.slideDown( [duration] [, callback] )
.slideUp( [duration] [, callback] )
.slideToggle( [duration] [, callback] )

• duration A string or number determining how long the animation will run.
• callback A function to call once the animation is complete.

.slideDown( [duration] [, easing] [, callback] )
.slideUp( [duration] [, easing] [, callback] )
.slideToggle( [duration] [, easing] [, callback] )

• duration A string or number determining how long the animation will run.
• easing A string indicating which easing function to use for the transition.
• callback A function to call once the animation is complete.

.stop()

Stop the currently-running animation on the matched elements.

.stop( [clearQueue] [, jumpToEnd] )

• clearQueue A Boolean indicating whether to remove queued animation as well. Defaults to false.
• jumpToEnd A Boolean indicating whether to complete the current animation immediately. Defaults to false.

.stop( [queue] [, clearQueue] [, jumpToEnd] )

• queue The name of the queue in which to stop animations.
• clearQueue A Boolean indicating whether to remove queued animation as well. Defaults to false.
• jumpToEnd A Boolean indicating whether to complete the current animation immediately. Defaults to false.

.submit()

Bind an event handler to the "submit" JavaScript event, or trigger that event on an element.

.submit( handler(eventObject) )

• handler(eventObject) A function to execute each time the event is triggered.

.submit( [eventData], handler(eventObject) )

• eventData A map of data that will be passed to the event handler.
• handler(eventObject) A function to execute each time the event is triggered.

.submit()

Trigger the "submit" event.

.text()

Get the combined text contents of each element in the set of matched elements, including their descendants.

.text()

Getter.

.text( textString )

• textString A string of text to set as the content of each matched element.

.text( function(index, text) )

• function(index, text) A function returning the text content to set. Receives the index position of the element in the set and the old text value as arguments.

.toggle()

Display or hide the matched elements.

.toggle( [duration] [, callback] )

• duration A string or number determining how long the animation will run.
• callback A function to call once the animation is complete.

.toggle( [duration] [, easing] [, callback] )

• duration A string or number determining how long the animation will run.
• easing A string indicating which easing function to use for the transition.
• callback A function to call once the animation is complete.

.toggle( showOrHide )

• showOrHide A Boolean indicating whether to show or hide the elements.

.toggle()

Bind two or more handlers to the matched elements, to be executed on alternate clicks.

.toggle( handler(eventObject), handler(eventObject) [, handler(eventObject)] )

• handler(eventObject) A function to execute every even time the element is clicked.
• handler(eventObject) A function to execute every odd time the element is clicked.
• handler(eventObject) Additional handlers to cycle through after clicks.

.toggleClass()

Add or remove one or more classes from each element in the set of matched elements, depending on either the class's presence or the value of the switch argument.

.toggleClass( className )

• className One or more class names (separated by spaces) to be toggled for each element in the matched set.

.toggleClass( className, switch )

• className One or more class names (separated by spaces) to be toggled for each element in the matched set.
• switch A Boolean (not just truthy/falsy) value to determine whether the class should be added or removed.

.toggleClass( [switch] )

• switch A boolean value to determine whether the class should be added or removed.

.toggleClass( function(index, class, switch) [, switch] )

• function(index, class, switch) A function that returns class names to be toggled in the class attribute of each element in the matched set. Receives the index position of the element in the set, the old class value, and the switch as arguments.
• switch A boolean value to determine whether the class should be added or removed.

.val()

Get the current value of the first element in the set of matched elements.

.val()

Getter.

.val( value )

• value A string of text or an array of strings corresponding to the value of each matched element to set as selected/checked.

.val( function(index, value) )

• function(index, value) A function returning the value to set. this is the current element. Receives the index position of the element in the set and the old value as arguments.

.wrap()

Wrap an HTML structure around each element in the set of matched elements.

.wrap( wrappingElement )

• wrappingElement An HTML snippet, selector expression, jQuery object, or DOM element specifying the structure to wrap around the matched elements.

.wrap( function(index) )

• function(index) A callback function returning the HTML content or jQuery object to wrap around the matched elements. Receives the index position of the element in the set as an argument. Within the function, this refers to the current element in the set.

.wrapAll()

Wrap an HTML structure around all elements in the set of matched elements.

.wrapAll( wrappingElement )

• wrappingElement An HTML snippet, selector expression, jQuery object, or DOM element specifying the structure to wrap around the matched elements.

.wrapInner()

Wrap an HTML structure around the content of each element in the set of matched elements.

.wrapInner( wrappingElement )

• wrappingElement An HTML snippet, selector expression, jQuery object, or DOM element specifying the structure to wrap around the content of the matched elements.

.wrapInner( function(index) )

• function(index) A callback function which generates a structure to wrap around the content of the matched elements. Receives the index position of the element in the set as an argument. Within the function, this refers to the current element in the set.