Hello, i have lots of divs that are generated via database query.

 

I am using this:

$(function(){
    $(".blogresults").hover(function () {
        $(".blogdesc").slideUp("fast");
    });
});

to slide in the .blogdesc div but it is happening on all the divs at the same time.

 

How can i edit this code to only affect the div hovered?

 

Also, anyway to make the slidetoggle go up not down?

i think .next may help you

 

$(this).next(".blogdesc").slideUp("fast");

try that

$(function(){
   $(".blogresults").bind('hover', function () {
      $(this).slideUp("fast");
   });
});

 

you can use $(this) to select the element you have hovers over, this is the same for things like click, mouseover etc...

Or, if .bloddesc is not actually the next element, you can use:

 

$(function(){
    $(".blogresults").hover(function () {
        $('.blogdesc', this).slideUp("fast");
    });
});

Example: http://jsfiddle.net/6NR2Q/