title: Expand/Collapse Text
body: <p>The code below works fine with ONE Reveal/Hide Text process</p>
  
  <pre><code>&lt;div class="reveal"&gt;Click Here to READ MORE...&lt;/div&gt;
  &lt;div style="display:none;"&gt;
  
  &lt;div class="collapse" style="display:none;"&gt;Collapse Text&lt;/div&gt;
  </code></pre>
  
  <p>However if this code is duplicated multiple times, the Collapse Text shows up and doesn't disappear and in fact conflicts with the Expand to reveal even more text instead of collapsing as it should.</p>
  
  <p>In this <a href="http://jsfiddle.net/syEM3/4/" rel="nofollow">http://jsfiddle.net/syEM3/4/</a>  click on any of the Click Here to READ MORE...
  Notice how the Collapse Text shows up at the bottom of the paragraphs and doesn't disappear. Click on the Collapse and it reveal more text.</p>
  
  <p>How do I prevent this and getting to work as it should?</p>