How to stop affecting more than one class with jQuery?
<p>I created this simple function and it works fine apart from the fact that I have more than one ".cta-mask" on the page. What do I need to do to stop affecting all the ".box-hover" when hover one of the ".cta-mask". Code bellow:</p>

<pre><code>$(document).ready(function() { 

  //header box     
  $('.box-hover').css('opacity' , '.6');

  $('.cta-mask').hover(function(){                        
    $('.box-hover').stop().animate({left:'-12px', opacity:'0.8'},{queue:false,duration:300})
  }, function(){
    setTimeout(function() {
      $('.box-hover').stop().animate({left:'-190px', opacity:'.6'},{queue:false,duration:600})
    }, 500)
  });
}); 
</code></pre>

<p>Thank you for your help in advance.</p>
