Search within TutorialsPark

Jquery Add Methods

Learn to Expand the selection using jQuery add method

Jquery Add Method

jQuery provides the add method to add contents to the jQuery object by adding additional elements.

Table : jQuery Add Method : Argument Types

Selector Description
add(selector, content)
To dd all the elements that are matched by the selector, with or without a context.
To add a single HTMLElement or an array of HTMLElements
add(jQuery) To add the contents of the specified jQuery Object

The jQuery method add returns a jQuery object upon which you can call other methods, including multiple add methods.

Example: jQuery add() Method

Give it a TRY! » Note: A set of jQuery objects is created using add() method, and css method is used to apply styles.

Jquery Determining the Context

Just like selectors, the context property provides the details of the context used to create the jQuery Object.

Example: Jquery Select Element using Extension Type Selectors

Give it a TRY! » Note:The scope (i.e context) of the jQuery is the element UL.

Jquery DOM Objects : Creating jQuery Objects from DOM objects

A jQuery object can be created by simply passing an HTMLElement object or an array of HTMLElement as an argument for the $ function.

The demo below selects p element using jQuery Object instead of using jQuery directly with a selector.

Example: Jquery DOM Objects Creating jQuery Objects from DOM objects

Give it a TRY! » Note:This demo shows how you can create a jQuery Object from a single HTMLElement object.

Jquery Objects : Treating jQuery Object as an Array

You can even treat a jQuery Object as an array of HTMLElement objects, i.e working with the DOM directly but still using jQuery features.

Example: Jquery Narrowing selection using HTMLElement

You can perform all types of operations of these arrays, like getting their lenght, size , index etc.

Give it a TRY! » Note: Use this method when you want to narrow a search programmatically.