Accepted answer

you need to make 2 changes

1 - Assign the dots class to the parent g element, so the i variable is only iterated per group of dots. Don't use assign class on the dots themselves.

var pointsGroup = g.selectAll(null)
  .attr("class", function(d, i) {
    return "dots" + i
  .attr("fill", function(d, i) {
    local.set(this, yScale[i])
    return colors[i];

2 - Select the dots class by including "." in the selection name

d3.selectAll(".dots" + i).style("opacity", newOpacity);

Related Query

More Query from same tag