title: Percentage bar goes up as button is pressed
body: <p><a href="http://liveweave.com/FUypwi" rel="nofollow">the code so far</a></p>
  
  <p>Now if you press a button, no matter which one, a div and a percentage will be shown. I've got that going for me, but if one div is toggled, and another one is pressed, the 66% div should be toggled and so on if two divs are shown and the third is toggled the 100% div should show up. 
  Basicly if you click a button, a div and a percentage div is revealed if you click aonther the percentage bar goes up. How do I do this? if two divs are toggled and if you press the button two diffrent divs are shown?</p>
  
  <p>JS</p>
  
  <pre><code>function showhide()
  {
      var div = document.getElementById("lol");
      var id3 = document.getElementById("3");
      var id5 = document.getElementById("5");
  
      if (div.style.display !== "none") 
      { 
  
          div.style.display = "none";
          id3.style.display = "none";
      }
      else {
          div.style.display = "block";
      }
  
  }
  
  function showhide2()
  {
      var div2 = document.getElementById("lol2");
  
      if (div2.style.display !== "none") {
          div2.style.display = "none";
      }
      else {
          div2.style.display = "block";
      }
  }
  
  function showhide3()
  {
      var div3 = document.getElementById("lol3");
  
      if (div3.style.display !== "none") {
          div3.style.display = "none";
      }
      else {
          div3.style.display = "block";
      }
  }
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;HTML5, CSS3 and JavaScript demo&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;!-- Start your code here --&gt;
  &lt;div id="lol"&gt;&lt;p&gt;div1&lt;/p&gt;&lt;/div&gt;
  &lt;div id="lol2"&gt;&lt;p&gt;div2&lt;/p&gt;&lt;/div&gt;
    &lt;div id="lol3"&gt;&lt;p&gt;div3&lt;/p&gt;&lt;/div&gt;
  &lt;button id="button" onclick="showhide()"&gt;div1&lt;/button&gt;  
    &lt;button id="button" onclick="showhide2()"&gt;div2&lt;/button&gt;   
  
    &lt;button id="button" onclick="showhide3()"&gt;div3&lt;/button&gt;   
    &lt;div id = "3"&gt;&lt;p&gt;33%&lt;/p&gt;&lt;/div&gt;
    &lt;div id = "5"&gt;&lt;p&gt;66%&lt;/p&gt;&lt;/div&gt;
    &lt;div id = "5"&gt;&lt;p&gt;100%&lt;/p&gt;&lt;/div&gt;
  &lt;!-- End your code here --&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>