Cloning content to a slider
<p>I'm working on a responsive design, and would like some of my content in a slider when it's below a certain size. However, I would like to avoid rendering the data twice, so the idea is to clone the content and append it to the slider on <code>(document).ready()</code>, then initialise it. That way, I can show my content in the normal fashion in landscape mode, and in a slider in portrait mode (thus saving space).</p>

<pre><code>var w = $(window).width();

if (w &lt; 769) {

   $("#container").children(".content").each(function () {
      $(this).clone().appendTo("#slider ul").wrap("li");
   });

  initialiseSlider(); // Nothing special about this          
}
</code></pre>

<p>The content is cloned to the slider container, but for some reason, it doesn't "slide". I'm thinking it may be because the slider is initialised before it has any content, because if I hardcode it, it works fine. Does that make sense? Any ideas on how I should fix this?</p>
