jQuery slider with tabs to animate the slider
<p>Hi I am trying to add some tabs to add more usability to a jQuery slider. I managed to add some tabs based on how many slides there are in the HTML. Now if I click on one of these tabs (1, 2, 3, 4) it will have to bring me to the related slide any ideas of directions on how to achieve this please?</p>

<p>This is what I have so far:</p>

<pre><code> var slides = $('.slide');
 var numberOfSlides = slides.length;

function createTabs() {  // creates tabs based on how many slides in HTML
for (i = 1; i &lt; numberOfSlides + 1; i++) {
    $('#tabsstyle').append('&lt;p&gt;' + i + '&lt;/p&gt;')
}
}
createTabs();
$("#tabsstyle p").click(function () {
// here the code to jump on the related slide
})
</code></pre>

<p>Let me know if you need more info.
Thanks</p>

<p>Added HTML</p>

<pre><code>&lt;div id="pageContainer"&gt;
&lt;!-- Slideshow HTML --&gt;
&lt;div id="slideshow"&gt;

&lt;div id="slidesContainer"&gt;

  &lt;div id="one" class="slide"&gt;
    &lt;h2&gt;&lt;/h2&gt;
    &lt;/div&gt;

  &lt;div id="two" class="slide"&gt;
    &lt;h2&gt;&lt;/h2&gt;
     &lt;/div&gt;

  &lt;div id="three" class="slide"&gt;
    &lt;h2&gt;&lt;/h2&gt;
   &lt;/div&gt;

  &lt;div id="four" class="slide"&gt;
    &lt;h2&gt;&lt;/h2&gt;
  &lt;/div&gt;


&lt;/div&gt;
&lt;div id="tabsstyle"&gt;&lt;/div&gt;
</code></pre>
