title: Multiple Jquery Slideshows
body: <p>I am trying to create a page with multiple jquery slideshows each with their own next, previous button using jquery cycle all. Here is my code:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  
  $(document).ready(function(){ 
      $('#slideshow').cycle({
      fx:'fade', 
      speed:1, 
      timeout: 0, 
      next:'#next',
      prev:'#prev',
      });
  });
  
      &lt;/script&gt;
  </code></pre>
  
  <p>and the html for 2 slideshows (but i want 4)</p>
  
  <pre><code>&lt;div id="content"&gt;
  &lt;a name="1" id="1"&gt;&lt;/a&gt;
  &lt;div id ="slideshow"&gt;
    &lt;img src="image2.jpg" width="675" height="420" /&gt;
    &lt;img src="image.jpg" width="675" height="420" /&gt;
  &lt;/div&gt;
  &lt;a id="prev" href="#" class="Code-Pro3"&gt;Prev&lt;/a&gt; &amp;nbsp;&amp;nbsp;  &lt;a id="next" href="#" class="Code-Pro3"&gt;Next &lt;/a&gt;
  
  
  &lt;a name="2" id="2"&gt;&lt;/a&gt;
  &lt;div id ="slideshow2"&gt;
    &lt;img src="image.jpg" width="675" height="420" /&gt;
    &lt;img src="image2.jpg" width="675" height="420" /&gt;
  &lt;/div&gt;
  &lt;a id="prev" href="#" class="Code-Pro3"&gt;Prev&lt;/a&gt; &amp;nbsp;&amp;nbsp;  &lt;a id="next" href="#" class="Code-Pro3"&gt;Next &lt;/a&gt;
  </code></pre>
  
  <p>any help is appreciated. thanks.</p>