1.4

Matched element Matched element after script execution
<div id="box">
<p>Peter Parker</p>
</div>
<div id="box">
<h1>Personal information</h1>
<p>PeterParker</p>
</div>
This script uses the function query() to find a box, prepends a heading and sets the text color of
the entire box to red.
query("#box").prepend("<h1>Personal information</h1>").css
("color","red");
Matched element Matched element after script execution
<div id="box">
<p>Peter Parker</p>
</div>
<div id="box"style="color: red;">
<h1>Personal information</h1>
<p>Peter Parker</p>
</div>
Note: the way the functions prepend() and css() are used in this script is called 'chaining'.
Chaining is optional; the same could be achieved by storing the result of the query in a
variable:
var box = query("#box");
box.prepend("<p>Peter Parker</p>");
box.css("color","red");
query()
Creates a new result set containing the HTML elements that match the supplied CSS selector.
The context (optional) allows you to restrict the search to descendants of one or more context
elements.
l query(selector)
l query(selector, context)
Page 58