Animated popup for web element

I've got a fiddle setup with some html and css - what I need to do is add an expand/collapse effect to it. I need it to be collapsed initially, then expand upwards when the user clicks the arrow. (I don't want the base to move). When the arrow (or preferably an alternate arrow) is clicked again I need it to collapse back down. Also, when another expand arrow is clicked on the page, it needs to be able to collapse automatically. We only want one story to be open at a time. Message me for more details!