title: How to change styling of a SVGCircleElement object?
body: <p>In my scatterplot I'd like to change the styling(opacity/color) of a circle on mouseover and  also for all other circles which, share the same className.</p>
  
  <p>But <code>groupList[i].style("opacity", .6);</code> seems not to be the correct way. </p>
  
  <pre><code>var mouseOver = function() { 
      var circle = d3.select(this);
  
      var highlitedGroup = this.className.baseVal;
  
      var groupList = document.getElementsByClassName(highlitedGroup);
  
      // The styling for the circle which mouse is over it.     
      circle.transition()
          .duration(800).style("opacity", 1)
          .attr("r", 16).ease("elastic");
  
      // For the all other circles which have the same className do this styling  
      for (var i=0; i&lt;groupList.length; i++) {
                 // List of SVGCircleElement objects  
                  groupList[i].style("opacity", .6); //??
          }     
  }
  </code></pre>