title: My javascript function runs in duplicate(?) when I add click event
body: <p>Disclaimer: I am trying to learn javascript. I am not a clever man. </p>
  
  <p>So, I made a Jquery image slider. And I was proud. It works. It loads images, and it displays them one-after-another, day-in, day-out. Life was good.</p>
  
  <p>Then I wanted to add navigation to the slider, and darkness fell upon my little kingdom.</p>
  
  <p>When I click on one of the buttons, I call my LoadSlide function passing on the appropriate index <code>LoadSlide(NewIndex)</code>. And then it runs the function, but it also continues running the function with the standard <code>LoadSlide(index+1)</code> argument. So without clicking any buttons it runs like so:</p>
  
  <pre><code>slide1 -&gt; (6500ms) -&gt; slide2 -&gt; (6500ms) -&gt; slide3 -&gt; (6500ms) -&gt; slide1 ...
  </code></pre>
  
  <p>And then I click a button (slide 2), and another loop starts in parallel:</p>
  
  <pre><code>slide1 -&gt; (6500ms) -&gt; slide2 -&gt; (6500ms) -&gt; slide3 -&gt; (6500ms) -&gt; slide1 ...
     [click] slide2 -&gt; (6500ms) -&gt; slide3 -&gt; (6500ms) -&gt; slide1 -&gt; (6500ms)...
  </code></pre>
  
  <p>Please advise me, keepers of the lore. Thou shall enjoy many maidens and endless measures of ale, if this dragon is slain. </p>
  
  <p>Pitiful code is here: <a href="http://jsfiddle.net/V6svT/2/" rel="nofollow">http://jsfiddle.net/V6svT/2/</a></p>