jQuery: DOM Manipulation Methods

Method Description
append Inserts DOM elements at the end of selected element(s).
appendTo Perform same task as append() method. The only difference is syntax. Here, first specify DOM elements as a string which you want to insert and then call appendTo() method with selector expression to select the elements where you want to append the specified DOM elements.
before Inserts content (new or existing DOM elements) before specified element(s) by a selector.
after Inserts content (new or existing DOM elements) after selected element(s) by a selector.
detach Removes the specified element(s).
empty Removes all child element(s) of selected element(s).
html Get or Set html content to the selected element(s).
insertAfter Insert DOM element(s) after selected element(s). Perform same task as after() method, the only difference is syntax.
insertBefore Insert DOM element(s) before selected element(s). Perform same task as before() method, the only difference is syntax.
prepend Insert content at the beginning of the selected element(s).
prependTo Insert content at the beginning of the selected element(s). Perform same task as prepend() method, the only difference is syntax.
prop Get or Set the value of specified property of selected element(s).
remove Removes selected element(s) from the DOM.
removeAttr Removes specified attribute from selected element(s).
removeProp Removes specified property from selected element(s).
replaceAll Replace all target element(s) with specified element.
replaceWith Replace all target element(s) with specified element and return the set of elements which was removed.
text Get or set text content of the selected element(s).
wrap Wrap an HTML structure around each selected element(s).
unwrap Remove the parents of selected element(s).
val Get or set the value of selected element(s)
wrapAll Combine all the selected element(s) and wrap them with specified HTML.
wrapInner Wrap an inner html of selected element(s) with specified HTML.

CSS Methods

CSS Methods Description
css Get or set style properties to the selected element(s).
addClass Add one or more CSS class to the selected element(s).
hasClass Determine whether any of the selected elements are assigned the given CSS class.
removeClass Remove a single class, multiple classes, or all classes from the selected element(s).
toggleClass Toggles between adding/removing classes to the selected elements

Dimensions Methods

Dimensions Methods Description
height Get or set height of the selected element(s).
innerHeight Get or set inner height (padding + element's height) of the selected element(s).
outerHeight Get or set outer height (border + padding + element's height) of the selected element(s).
offset Get or set left and top coordinates of the selected element(s).
position Get the current coordinates of the selected element(s).
width Get or set the width of the selected element(s).
innerWidth() Get or set the inner width (padding + element's width) of the selected element(s).
outerWidth Get or set outer width (border + padding + element's width) of the selected element(s).
scrollLeft Get or set the current horizontal position of the scrollable content of selected element.
scrollTop Get or set the current vertical position of the scrollable content of selected element.
Want to check how much you know jQuery?