It is not necessary to clutter our HTML with classes in order to be able to process groups of tags within our web page. There are also a number of properties available once we have obtained a node from within our web page that can be used to move directly to related nodes within the page.
From any node within the web page the next adjacent node at the same level within the DOM hierarchy can be accessed using the nextSibling property. The only thing we need to watch for in using this to step through a number of nodes at the same level within our page is that we probably do not want to process all nodes and will have some that we will want to skip over.
In this example we start at the node having an id="first" and then step through all of the nodes at the same level replacing the text content of all of the nodes that we can find that are not text nodes (nodeType = 3 indicates a text node). We also need to make sure that it skips over the script tag at the end of our page.
HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<head>
<title>Example D05</title>
</head>
<body>
<div>x</div>
<div>x</div>
<div id="first">x</div>
<div>x</div>
<div>x</div>
<div>x</div>
<script type="text/javascript" src="exampleD05.js"></script>
</body>
</html>
JavaScript
var node;
node = document.getElementById('first');
while (node) {
if (3 !== node.nodeType && 'SCRIPT' !== node.nodeName)
node.innerHTML = 'y';
node = node.nextSibling;
}