title: sliding divs from bottom to top
body: <p>I am trying to slide divs from bottom to top. I have 3 divs. In that first two will be visible, </p>
  
  <p>on click: </p>
  
  <pre><code>1st div get hides.
  2nd div takes 1st div position.
  3rd div takes 2nd div position.
  </code></pre>
  
  <p>again on click: </p>
  
  <pre><code>2nd div get hides.
  3rd div takes 2nd div position 
  1st div takes 3rd div position. 
  </code></pre>
  
  <p>Check this:- <a href="http://jsfiddle.net/2cz5v/5/" rel="nofollow">http://jsfiddle.net/2cz5v/5/</a></p>
  
  <p>Working for 3 clicks, then it starts interchanging the divs. Please Help me out.</p>