title: how to set the radius of a shape to bigger or smaller by pressing buttons in javascript/svg
body: <p>Hi I have the following code and I want to be able to change the radius of a circle by pressing a button I dont know what to use after style. in the
  document.getElementById("circle1").style.r="10"; part of the code   </p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
      &lt;script&gt;
      function circle() {
          document.getElementById("circle").style.r="50";
  }
  
      function circle1() {
          document.getElementById("circle1").style.r="10";
  
  } 
  
  
      &lt;/script&gt;
  
  
      &lt;/head&gt;
      &lt;svg xmlns="http://www.w3.org/2000/svg" version="1.1" id="svg" &gt;
       &lt;circle id = "circle" cx = "100" cy = "800" r = "30" stroke="blue" stroke-width = "2" fill = "black"/&gt;
       &lt;circle id = "circle1" cx = "20" cy = "500" r = "30" stroke="blue" stroke-width = "2" fill = "black"/&gt;
      &lt;/svg&gt;
      &lt;body&gt;
      Set size of circles
      &lt;input type="button" onclick="circle()" value="big" /&gt;
      &lt;input type="button" onclick="circle1()" value="small" /&gt;
      &lt;/body&gt;
      &lt;/html&gt;
  </code></pre>