title: How to make all elements in groups of svg change color onclick (js)
body: <p>I want to change the fill (onclick) of all elements in a group from a svg file. At the moment, I use javascript to set an attribute to an id. This seems to only change one of the elements.</p>
  
  <p>I have tried inline of svg using onclick. it didn´t seem to work. So i started with javascript. Now, it fills only one trianlge, whilst I set the function to call from the group.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function callred(){
    document.getElementById('btn1').setAttribute('fill', '#ff00ff');
  }</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>#svg-object{
      
          height: 100vh;    
          width: 100%;
          background-size: cover;
          background-position: center center;
          border: 15px antiquewhite;
          position: absolute;
      
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  --&gt;
  &lt;!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"&gt;
  &lt;svg id="svg-object" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
    width="800px" height="754px" viewBox="0 0 800 754" enable-background="new 0 0 800 754" xml:space="preserve"&gt;
  &lt;g id="btn1" onclick="callred()"&gt;
   &lt;polygon fill="#FF0013" points="366.699,131 410,56 453.301,131  "/&gt;
   &lt;polygon fill="#07FF00" points="323.699,656 367,581 410.301,656  "/&gt;
   &lt;polygon fill="#0000FF" points="409.699,656 453,581 496.301,656  "/&gt;
   &lt;polygon points="366.699,581 410,656 453.301,581  "/&gt;
  &lt;/g&gt;
  
  
  &lt;/svg&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I expect all elements in the group to change to another color when clicked on any element of the group and for them to stay this color.</p>