title: How to use D3 selectAll with multiple class names
body: <p>I'm experimenting with using multiple class names for SVG elements so that (hopefully) I could select a subset of them using selectAll and "parts" of the class name.  Unfortunately nothing I've tried works and I haven't found an example online.  The code below demonstrates what I'm trying to do with a simple example of four circles.  Two circles have class name "mYc 101" and two circles have class name "mYc 202".  selectAll(".mYc") gives all four circles.  What if I want only the circles with class name "mYc 101"?  Can this be done?  How?  Thanks times infinity!!</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;meta charset="utf-8"&gt;
  &lt;body&gt;
  &lt;div id="my_div"&gt;&lt;/div&gt;
  &lt;script src="http://d3js.org/d3.v3.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
      var m_div = d3.select("#my_div");
      var m_svg = m_div.append("svg");
  
      var g = m_svg.append("g");
  
      g.append("circle")
          .attr("class", "mYc 101")
          .attr("cx", 100)
          .attr("cy", 100)
          .attr("r", 50) 
          .attr("style", "stroke: green; stroke-width: 8; fill: #000000");
  
      g.append("circle")
          .attr("class", "mYc 101")
          .attr("cx", 300)
          .attr("cy", 100)
          .attr("r", 50) 
          .attr("style", "stroke: green; stroke-width: 8; fill: #000000");
  
      g.append("circle")
          .attr("class", "mYc 202")
          .attr("cx", 100)
          .attr("cy", 300)
          .attr("r", 50) 
          .attr("style", "stroke: blue; stroke-width: 8; fill: #000000");
  
      g.append("circle")
          .attr("class", "mYc 202")
          .attr("cx", 300)
          .attr("cy", 300)
          .attr("r", 50) 
          .attr("style", "stroke: blue; stroke-width: 8; fill: #000000");
  
      // This selects all four circles
      var list = d3.selectAll(".mYc");
  
      // But if I want to select only class "mYc 101", none of these work.
      // In fact they all give an error.
      // var list1 = d3.selectAll(".mYc 101");
      // var list1 = d3.selectAll(".mYc .101");
      // var list1 = d3.selectAll(".mYc.101");
      // var list1 = d3.selectAll(".mYc,.101");
      // var list1 = d3.selectAll(".101");
  
  &lt;/script&gt;
  &lt;/body&gt;
  </code></pre>