Often selecting a single element is not good enough, but rather you want to apply a certain change to a set of elements on the page simultaneously. In this recipe, we will play with the D3 multi-element selector and its selection API.
Open your local copy of the following file in your web browser:
https://github.com/NickQiZhu/d3-cookbook-v2/blob/master/src/chapter2/multiple-selection.html .
This is what the d3.selectAll function is designed for. In the following code snippet, we will select three different div elements and enhance them with some CSS classes:
<div></div>
<div></div>
<div></div>
<script type="text/javascript">
d3.selectAll("div") // <-- A
.attr("class", "red box"); // <-- B
</script>
This code snippet produces the following visual:
Multi-element selection