Can't get .next() to work
<p>I'm trying to add a class so that the span text shows on hover, 
but only for that particular image not all images at once.</p>

<p>I can get it to add class to all the spans at once, but when I try to limit it to only the span being hovered nothing happens.  The problem seems to be when I add .next('span') - although I don't know why.</p>

<p>Can anyone tell me what I'm doing wrong here?</p>

<pre><code>    $('.scroller-image').hover(function() {

         $(this).next('span').addClass('hover');
         }, function() {
         $(this).next('span').removeClass('hover');

    });
</code></pre>

<p>Here's the markup:</p>

<pre><code>&lt;div class="scroller-image"&gt;
    &lt;span&gt;image title&lt;/span&gt;
    &lt;img src="#" alt="#" /&gt;
&lt;/div&gt;
</code></pre>
