title: Add large chunk of HTML with Jquery
body: <p>I am designing a site that uses progressive enhancement and has also has a mobile version. I am wanting to use jquery to add a slideshow to the desktop site and want to know the best method for adding a large quantity of HTML. A sample of what I intend to add is:</p>
  
  <pre><code>&lt;!-- Slideshow --&gt;
  &lt;div class="scrollable"&gt;
  &lt;!-- "previous page" action --&gt;
  &lt;a class="prev browse left"&gt;&lt;/a&gt;   
  
  &lt;!-- root element for the items --&gt;
  &lt;ul&gt;
      &lt;li&gt;
          &lt;img src="images/slideshow/image1.jpg" alt="image 1" title="image 1" /&gt;
      &lt;/li&gt;
  
      &lt;li&gt;
          &lt;img src="images/slideshow/image2.jpg" alt="image 2" title="image 2" /&gt;
      &lt;/li&gt;
  
      &lt;li&gt;
          &lt;img src="images/slideshow/image3.jpg" alt="image 3" title="image 3" /&gt;
      &lt;/li&gt;
  
      &lt;li&gt;
          &lt;img src="images/slideshow/image4.jpg" alt="image 4" title="image 4" /&gt;
      &lt;/li&gt;
  
      &lt;li&gt;
          &lt;img src="images/slideshow/image5.jpg" alt="image 5" title="image 5" /&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;!-- "next page" action --&gt;
  &lt;a class="next browse right"&gt;&lt;/a&gt;
  </code></pre>
  
  <p>
  </p>
  
  <p>Would I be better using the append or HTML method for something like this. I also had another idea that I might create a variable with the HTML inside and use JQuery to add the contents but I have tried and failed on that one (lack of sufficient knowledge!). I would appreciate any advice.</p>