Introducing JavaScript - HTML5 Foundations - page 203

The getElementsByClassName() function can be used to simultaneously select multiple elements based on a
class that has been assigned to them. This function will return an array of element objects. An array is very much
like a list, where each item is separated by a comma. Arrays are enclosed within square brackets, as shown in the fol-
lowing example:
[“red", “green", “blue"]
Try using the getElementsByClassName() function to select all elements that have the class paragraph .
document.getElementsByClassName(“paragraph");
This should return an array of two element objects. These are the paragraphs from the text section. Figure 10-3
shows the output in the console window.
Figure 10-3 Selecting elements using getElementsByClassName().
Note that the getElementsByClassName() function is not supported in Internet Explorer 6 to 8.
getElementsByTagName()
There may also be scenarios in which you would like to select a number of elements by their tag name. For such oc-
casions, you can use the getElementsByTagName() function.
Try selecting all the paragraph elements on the page:
document.getElementsByTagName(“p");
Figure 10-4 shows the expected output for this selection. In this figure I have expanded the final three elements so
that you can see their contents by clicking the little gray triangle next to the element in the output.