jQuery removeClass called at end of slideUp removes from all elements not just this -

i struggling (pretty simple) jquery. have few boxes on page slide description on rollover. slide starts class added , when ends class removed - done classes rather hover styling remains until slide completes.

it works fine on individual box when mouse off 1 box , straight onto class gets removed second box , left on first first item completes slide up.

here jquery:

jquery(document).ready(function () {      // rollover on features     jquery(".titleimageblurbandlinkwrapper a").hover(         function () {             thisfeature = jquery(this);              // change class when slide starts             thisfeature.addclass("hover");             // show info sliding             thisfeature.find(".blurb").stop(true, true).slidedown();         }, function () {             // hide info             thisfeature.find(".blurb").stop(true, true).slideup({ queue: false, complete: function() {                     // change class when slide finishes                     thisfeature.removeclass("hover");                 }}             );         }     );  }); 

i define thisfeature @ start jquery(this). roll on second box class "hover" correctly added second box first box completes .slideup class removed second box , not first.

i expected context of thisfeature remain within animation declared in seems second box redefines original thisfeature , when first animation ends class removed second box , not first.

what can do?

thanks!

john

you need use closure variables

jquery(document).ready(function () {      // rollover on features     jquery(".titleimageblurbandlinkwrapper a").hover(function () {         var thisfeature = jquery(this);         // change class when slide starts         thisfeature.addclass("hover");         // show info sliding         thisfeature.find(".blurb").stop(true, true).slidedown();     }, function () {         var thisfeature = jquery(this);          // hide info         thisfeature.find(".blurb").stop(true, true).slideup({             queue: false,             complete: function () {                 // change class when slide finishes                 thisfeature.removeclass("hover");             }         });     }); }); 

---

when enter element 1 thisfeature refers element, move out mouseleave animation triggered correct element, before animation on enter element 2 global variable thisfeature referring element 2 not element 1 time mouseleave animation element 1 on , complete callback called thisfeature element 2 instead of element 1