title: jQuery .eq() issue with hidden elements?
body: <p>I'm trying to iterate over two or more layers, fading one out and the next in.
  At the start, both layers have the style "display:none;" - therefore, at the first method call, I just fadeIn() element .eq(0) - after that, I always fadeOut() .layer:visible and fadeIn() .eq(currentSlide).
  currentSlide was initialized with 0 before and gets iterated at each call.</p>
  
  <p>A no-brainer, one would think.
  But here is what happens:
  Whenever the animation starts, the first element gets faded in <em>twice</em> - after that the animation runs as expected, <em>but</em> the elements are in different order. The first element in the markup suddenly is .eq(1) and the second one is at index .eq(0).</p>
  
  <p>If I remove display:none; from the layers, everything works perfect - it must be related to the visibility settings and maybe a selector not seeing the layers?
  (But .children().length() always gives me the correct number though...)  </p>
  
  <p>The markup:</p>
  
  <pre><code>&lt;div class="elements"&gt;
    &lt;div class="layer"&gt;&lt;img src="uploads/pics/one.png" /&gt;&lt;/div&gt;
    &lt;div class="layer"&gt;&lt;img src="uploads/pics/two.png" /&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The jQuery plugin method written in coffescript:</p>
  
  <pre><code>   if element.find('.layer:visible').length &gt; 0 and element.find('.elements').children().length &gt; 1
      element.find('.layer:visible').fadeOut -&gt; element.find('.elements').children().eq(currentSlide).fadeIn()
    else
      element.find('.elements').children().eq(0).fadeIn()
  
    # Iterate over slides or reset to zero if last one is reached
    if currentSlide &lt; element.find('.elements').children().length - 1
      currentSlide++
    else
      currentSlide = 0
  </code></pre>