title: How do I make an element hide until a link is clicked?
body: <p>I am trying to get the Meet Some of Our Staff section to only show once the text "Meet Some of Our Staff" is clicked. I have used code that has gotten it to hide the section when "Meet Some of Our Staff" is clicked, but cannot figure out how to reverse it to where it is already hidden upon page load and then appears when "Meet Some of Our Staff" is clicked.</p>
  
  <p>Script:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  function hideshow(which){
  if (!document.getElementById)
  return
  if (which.style.display="block")
  which.style.display="none"
  else
  which.style.display="block"
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="content3"&gt;
  &lt;div class="title2"&gt;
  &lt;h1&gt;&lt;center&gt;&lt;a href="javascript:hideshow(document.getElementById('staff'))"&gt;Meet Some
  of Our Staff&lt;/a&gt;&lt;/center&gt;&lt;/h1&gt;
  &lt;/div&gt;
  
  &lt;div id="staff"&gt;
  &lt;center&gt;
  &lt;ul&gt;
  
  &lt;a href="http://www.instituteforcreativelearners.org/" 
  onclick="centeredPopup(this.href,'myWindow','500','300','yes');return false"&gt;
  &lt;li&gt;
  &lt;img src="images/kami.jpg" alt="..."&gt;
  &lt;br /&gt;
  &lt;p&gt;&lt;span class="stafftitle"&gt;Kami Barron&lt;/span&gt; &lt;br /&gt; &lt;span  
  class="staffsubtitle"&gt;Director of Education&lt;/span&gt;&lt;/p&gt;
  &lt;/li&gt;
  &lt;/a&gt;
  
  &lt;/ul&gt;
  &lt;/center&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>