Autocomplete enables users to quickly find and select from a pre-populated list of values as they type, leveraging searching and filtering. Any field that can receive input can be converted into an Autocomplete, namely, <input> elements, <textarea> elements, and elements with the contenteditable attribute. By giving an Autocomplete field focus or entering something into it, the plugin starts searching for entries that match and displays a

Adds the specified class(es) to each of the set of matched elements while animating all style changes. Similar to native CSS transitions, jQuery UI's class animations provide a smooth transition from one state to another while allowing you to keep all the details about which styles to change in CSS and out of your JavaScript. All class animation methods, including .addClass(), support custom durations and easings, as well as provide a callback for wh

Convert a pair of headers and content panels into an accordion. The markup of your accordion container needs pairs of headers and content panels: <div id="accordion"> <h3>First header</h3> <div>First content panel</div> <h3>Second header</h3> <div>Second content panel</div> </div> Accordions support arbitrary markup, but each content panel must always be the next sibling after its ass

Types JavaScript provides several built-in datatypes. In addition to those, this page documents virtual types like Selectors, enhanced pseudo-types like Events and some concepts you need to know about Functions. If you want to study these concepts in depth, take a look at MDN. You should be able to try out most of the examples below by just copying them to your browser's JavaScript Console (Chrome, Safari with Develop menu activated, IE 8+) or Firebug console (Firefox). Whenever an example

Wrap an HTML structure around the content of each element in the set of matched elements. The .wrapInner() function can take any string or object that could be passed to the $() factory function to specify a DOM structure. This structure may be nested several levels deep, but should contain only one inmost element. The structure will be wrapped around the content of each of the elements in the set of matched elements. Consider the following HTML: <

Ajax Events Ajax requests produce a number of different events that you can subscribe to. Here's a full list of the events and in what order they are triggered. There are two types of events: Local Events These are callbacks that you can subscribe to within the Ajax request object, like so: $.ajax({ beforeSend: function(){ // Handle the beforeSend event }, complete: function(){ // Handle the complete event } // ...... }); Global Events These events are triggered on t

Wrap an HTML structure around all elements in the set of matched elements. The .wrapAll() function can take any string or object that could be passed to the $() function to specify a DOM structure. This structure may be nested several levels deep, but should contain only one inmost element. The structure will be wrapped around all of the elements in the set of matched elements, as a single group. Consider the following HTML: <div class="container"&

Bind two or more handlers to the matched elements, to be executed on alternate clicks. Note: This method signature was deprecated in jQuery 1.8 and removed in jQuery 1.9. jQuery also provides an animation method named .toggle() that toggles the visibility of elements. Whether the animation or the event method is fired depends on the set of arguments passed. The .toggle() method binds a handler for the click event, so the rules outlined for the trigg

Selects all elements that are visible. Elements are considered visible if they consume space in the document. Visible elements have a width or height that is greater than zero. Elements with visibility: hidden or opacity: 0 are considered visible, since they still consume space in the layout. Elements that are not in a document are considered hidden; jQuery does not have a way to know if they will be visible when appended to a document since it depend

Remove a handler from the event for all elements which match the current selector, based upon a specific set of root elements. The .undelegate() method is a way of removing event handlers that have been bound using .delegate(). As of jQuery 1.7, the .on() and .off() methods are preferred for attaching and removing event handlers. .undelegate() version added: 1.4.2