title: JQuery load variable stored html into a div
body: <p>Friends,</p>
  
  <p>I have a simple page.  I have a div (let's call it #content) which contains content (in html) that I want to store into a variable.</p>
  
  <pre><code>&lt;div id="content"&gt;
     &lt;div id="left"&gt;
        &lt;h1&gt;Cool title&lt;/h1&gt;
        &lt;p&gt;text&lt;/p&gt;
     &lt;/div&gt;
     &lt;div id="right"&gt;
        &lt;p&gt;more text&lt;/p&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I then have a div which is binded to a click function through JQuery.  When clicked, it stores the content of #content into a variable, storedHTML, and the height to storedHeight.  It then sets the height of #content to 0 and deletes the html within #content.</p>
  
  <p>Then when clicked again it animates the height back to the storedHeight, let's say 200px; it also reloads the html back into the div.</p>
  
  <p>The problem lies in reloading the html into the div.  How do I go about doing this?  I've tried:</p>
  
  <pre><code>storedHTML = $('#content').html(); //to store it
  $('#content').html(''); //to clear it 
  $('#content').html(storedHTML); //to load it back up again
  </code></pre>
  
  <p>tries to load it...but to no avail.</p>
  
  <p>This worked perfectly when I first wrote it to grab text from a p tag, minimize it, and then enlarge it back up again.  E.g.:</p>
  
  <pre><code>storedText = $('p#example').text(); //to store it
  $('p#example').text(''); //to clear it
  $('p#example').text(storedText) //to load it back up again
  </code></pre>
  
  <p>For the purpose of this html load, I have tried using .html(), .text(), .data(), .load(). and a combination of .html() and .append()</p>
  
  <p>I'm clearly failing.  I can't figure out how to load html (multiple divs and such) back into this div.  I would love to learn the proper way to do this!</p>
  
  <p>Thank you kindly for all your continued help friends.</p>