title: javascript function to expand html section on click
body: <p>I have a html webpage where I have a list that when an item is clicked it will expand some text and make the container increase in height. What is the best way to detect the contracting of a list item.  </p>
  
  <p>For example when I click an item it expands and everthing increases in size correctly.  However when I click the same item again, it increases the container again, because I am not sure how to distinguish the expand and contract, using one function for all the items on the list.</p>
  
  <pre><code>function slidedown(id){
    $('#'+id.id+'text').slideToggle(250);   
    var height = document.getElementById("aboutmiddle").style.height
    value = parseInt(height);
    value +=100;
    document.getElementById("aboutmiddle").style.height = value+"px";
  }
  </code></pre>
  
  <p>as you can see on click I want it to increase the height of aboutmiddle but I would like to decrease aboutmiddle height on the second click.</p>