title: jQuery toggle hide text first
body: <p>I've searched for a solution for my problem and could find a few approaches, however, none of them worked as expected. So, this is my try to understand the jQuery toggle-function. I hope you can help me!</p>
  
  <ol>
  <li>The issue: I would like to hide text and make it visible after clicking on a button/link.</li>
  <li>The solution: The toggle-function. Unfortunately, this shows the text first and hides it after clicking the button/link. </li>
  <li>The code: So, I found this code from an older post here on stack (sorry, I can't find the author, if it's you - please text me and I'll credit you properly.)</li>
  </ol>
  
  <p>The script:</p>
  
  <pre><code>function toggle_visibility(id) {
    var e = document.getElementById(id);
    e.style.display = ((e.style.display!='none') ? 'none' : 'block');
  }
  
  document.getElementById('showDiv').onclick=function(){
    // Remove any element-specific value, falling back to stylesheets
    document.getElementById('element').style.display='';
  };
  </code></pre>
  
  <p>In my html body-part I used the following code:</p>
  
  <pre><code>&lt;a onclick="toggle_visibility('private');"&gt;
    &lt;b&gt;» Private Enquity / Venture Capital&lt;/b&gt;
  &lt;/a&gt;
  &lt;div id="private"&gt;
    &lt;p&gt;In arcu accumsan arcu adipiscing accumsan orci ac. Felis id enim aliquet. Accumsan ac integer lobortis commodo ornare aliquet accumsan erat tempus amet porttitor. Ante commodo blandit adipiscing integer semper orci eget. Faucibus commodo adipiscing mi eu nullam accumsan morbi arcu ornare odio mi adipiscing nascetur lacus ac interdum morbi accumsan vis mi accumsan ac praesent.&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The toggle function works as described, but how can I make the text inside  hide until the link is clicked?
  I'm super new to this and appreciate your help.</p>
  
  <p>Thank you! </p>