jQUery .slideToggle() & .text replace
<p>I've got the following problem (test version available <a href="http://jsfiddle.net/qmP8R/2/" rel="nofollow">http://jsfiddle.net/qmP8R/2/</a>):</p>

<p>I have two <code>&lt;div&gt;</code> containing two versions of text and a third <code>&lt;div&gt;</code> used as a "container".</p>

<p>On load the container is populated with the shorten text. On the click of a button I want to change the short version for the long version with some animation (sliding up/down animation) and vice versa (swap short for long and long for short - basically toggle). </p>

<p>In the test version it works quite as expected, but I am not able to solve the following problems:</p>

<ul>
<li>animation on 1st click does not work (but the text is changed to the long version)</li>
<li>on second click the whole container is slided up - not reverting to initial state</li>
</ul>

<p>Basically what I waht to achieve is a kind of toggle behaviour, but connected with .text replacement rather than display: show/hide.</p>

<p>P.S.: AJAX content replacement is not available as a solution in my case.</p>
