Jquery .children and .each usage
<p>OK, I have been able to get this working using the following:</p>

<p><code>$('.jcaption').hover(function() {
     $('.caption', this).stop(false, true).animate({bottom:0},{duration:250, easing: style});
$('.jcaption').hover(function() {
     $('.caption', this).stop(false, true).animate({bottom:-100},{duration:250, easing: style});
})</code></p>

<p>using the following html:</p>

<p>div class="photo" img src="" div class="caption" span-caption goes here/span-/div-/div> </p>

<p>The problem that I'm having now is that I have to follow this same HTML structure for each image caption.  Is there a way to consolidate this where I could just list several images under the div class photo instead of having to list each separately?</p>

<p>I'm using this code:</p>

<pre><code>$('.photo').hover(function() {
    $(this).children()
        .stop(false,true)
        .animate({bottom:-50},{duration:200, easing: style});
</code></pre>

<p>to animate an image caption, and want to apply the effect to every image with the class .photo.  As the code currently is, it applies the effect only to the first .photo class, and if any more image captions are added with this class, it just overlaps them on the first one.</p>

<p>Here is the corresponding html:</p>

<p>div class="photo" 
img src=""  div class="caption"  span-caption goes here/span-/div-/div> </p>
