1.4

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");
Creating an empty result set and adding elements to it
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);
Selector Matched element Matched element after script execution
#chapters <p id="chapters">{{chapters}}</p> <h1>Chapter 1</h1>
<p>Lorem ipsum...</p>
<h1>Chapter 2</h1>
<p>Loremipsum...</p>
<h1>Chapter 3</h1>
<p>Loremipsum...</p>
<h1>Chapter 4</h1>
<p>Loremipsum...</p>
addClass()
Adds the specified class(es) to each element in a set of HTML elements that match the selector
of the script or of another query in the template (see "query()" on page 209).This has no effect if
the class is already present.
addClass(classname)
Adds the specified class(es) to each element in a result set. Has no effect if the class is already
present.
classname
Page 180