Select option not toggling CSS properly..

Select option not toggling CSS properly..

I'm trying to change the css of different SVG polygons based on select options that target their classes, but the toggle isn't working properly. Here's the select element:

      <select id="option1" onchange="myfunctionA(this,event)">
              <option SELECTED VALUE="gray">Option 1</option>
              <option value="A">A</option>
              <option value="B">B</option>
              <option value="C">C</option>
      </select>

And the jquery code that almost works is:

      $(document).ready(function(){
                $("#option1").change(function(){
                          $(".A").toggleClass("green");
                });
      });

It looks like it's properly targeting just the polygons with the class A, which is good, but no matter what option is chosen, A, B, or C, it just toggles the A polygons between gray & green class css... but I'm wanting to highlight the A polygons only when option A is chosen.

Thanks -