add()

The add() function adds elements to one or more HTML elements, which can be:

• The elements that match the selector of a script (see results).
• One element that matches the selector of a script that runs for "Each matched element" (see this and Setting the scope of a script).
• The elements returned by a query in the template (see query()).

add(content)

The add() function adds HTML content to one or more HTML elements and returns the union of this result or result set and other content.

content

A query result. This can be an HTML string or a result set.

Examples

This script adds one query result to another and sets the background color to yellow.

query("#test1").add(query("#test2")).css("background", "yellow");​

Note: The way the functions add() and css() are used in this script is called 'chaining'. Chaining is optional; the same could be achieved by storing the results of the queries in a variable:

var myResult = query("#test1"); 
myResult.add(query("#test2");
myResult.css("background", "yellow");

The following script loads snippets in an iteration and adds their elements to an empty result set (using query()). Then it replaces a placeholder in the template with the new result.

var chapters = query(); 
for ( var i = 1; i <= 4; i++) { 
chapters = chapters.add(loadhtml('snippets/Chapter' + i + '.html')); 
} 
results.replaceWith(chapters);