Rafael Rafael - 6 months ago 14
jQuery Question

How to define a child element on a Jquery script

I am using waypoints.js and animate.css as this example: http://miguelmanchego.com/samples/2014/jquery-mostrar-animaciones.htm to add animations when scrolling.

If I have the structure:

<div class="FlyWithMe">
<div>I am a bird!</div>
<div>Mee too!</div>
</div>


I can of course animate them with:

$('.FlyWithMe').waypoint(function() {
$(this).toggleClass( 'bounceIn animated' );
}


But how can I define the child element to animate them instead of a container?

$('.FlyWithMe').waypoint(function() {
$(this>child).toggleClass( 'bounceIn animated' );
}


Of course I could add the class to the child element directly but this is just an example of a more complex case.

Answer

Use find function to select children:

$(this).find('div').toggleClass( 'bounceIn animated' );