Even More DOM
In the previous exercise, you have created the list of elements by joining strings to compose a simple HTML structure. The same HTML structure can be built programmatically using the DOM. In the next exercise, you will generate this content programmatically:
<div id=”myDivElement”>
Hello Dude! Here’s a cool list of colors for you:
<br/>
<ul>
<li>Black</li>
<li>Orange</li>
<li>Pink</li>
</ul>
</div>A DOM document is a hierarchical structure of elements, where each element can have one or more attributes. In this HTML fragment, the single element with an attribute is <div>, which has an attribute called id with the value myDivElement. The root node that you can access through the document object is <body>. When implementing the above HTML document, you will end up with a structure such as the one in the figure below:
Figure 2.3: A Hierarchy of HTML Elements
In Figure 2.3, you see an...
