Jquery animate on a class

Hey guys I am pretty new to JQuery and I have a question about animating on a child of a certain class.

I have the following:

    <div class="block"><img src="a.jpg" class="top"><img src="b.jpg"></div>
    <div class="block"><img src="c.jpg" class="top"><img src="d.jpg"></div>

I am calling the div with (this) and I would like to select the image with class 'top' to animate.

I have tried

$(this, 'img.top').animate({
            opacity:0
        },400);
    })

But it doesn't work. Does anyone know the correct syntax to p开发者_StackOverflowerform this selection? Thanks

---

You need to write $('img.top', this); the context parameter is the second one.

It's equivalent to $(this).find('img.top').

---

$('img.top').hover(function(){$(this).animate({
            opacity:0
        },400);});

try that ^^^^^^^
:-)

also make sure this runs when the dom is there or wrap it in:

$(function(){/*jquery stuff*/});

---

If you want to make sure you are animating on the image class="top" inside the div class="block" you could do this:

$('.block').children('img.top').animate({opacity:0},400);

Obviously if you are inside a function operating on the div with the class block, you can change to:

$(this).children('.top').animate({opacity:0},400);

See a demo here Hovering over the div will use $(this) to do the animation...