title: Change color of all elements in class on click JavaScript
body: <p>I have an image (SVG) of a human body. I would like to use JavaScript so that when I click a particular area (say, the lower leg) then all of the elements with the class "lower-leg" (even if not clicked) have their color changed -- this makes it much easier for the user.</p>
  
  <p>Here is the JavaScript I currently have:</p>
  
  <pre><code>function changeclassstyle() {
    var c = document.getElementsByClassName("lower-leg");
    for (var i=0; i&lt;c.length; i++) {
      c[i].style.fill = "red";
    }
  }
  </code></pre>
  
  <p>The problem with this code is that it is only generalized for "lower-leg". I may have over a dozen classes I would like this to work for and don't think it is efficient to write 12 functions with the only change being the class name. Is there a way to grab what class was selected and then input that in the function?</p>
  
  <p>--</p>
  
  <p>Additionally, I would love to figure out how, once that section of the body is selected, I can store the class name. I would, in the end, want to store the selection, along with other inputted information in a database. But, this may be for a future question unless someone can help!</p>