selecting jquery children with hover

Question

I have the following (broken) code:

 $(".old_post").hover(function(){
    $(this > ".post_right_nav").show();

post _ right _ nav is a div(containing other divs) that holds some controls for the user to press. I'd like to only show these controls when the user is hovering over a post. How can I properly select the child element of every post?

Answer 1

You can use context, the following is saying: Search for the elements that have class='post-right-nav' within the context of this

$(".old_post").hover(function(){
    $(".post_right_nav", this).show();
...

That will get you all descendants, if you want just the children you could do the following

$(".old_post").hover(function(){
    $(this).children(".post_right_nav").show();
...

I found a quick article that goes over the use of context in the jQuery selector

http://beardscratchers.com/journal/jquery-its-all-about-context