Removing a listener class doesn't stop a sound event associated Jquery Javascript -

i'm playing sound when hovering on image (this working fine already) , want include button turn off if desired. unfortunately haven't been able make work.

my current code goes like:

for creating sound

//a bunch of code generate audio ends on  var mouseoversound = createsoundbite('mysound.mp3') 

for triggering it

  $(".play").mouseover(function() {       mouseoversound.play();     }); 

the listener element

<%= image_tag "image.png", class:'logo-image play' %> 

i thought simplest solution disabling remove class 'listening' event (i.e. '.play') in element listener, tired:

  $(".sound").click(function(){     $(".logo-image").removeclass("play");   });  //.sound class of button that's intended block it. 

although latter script remove class 'play' sound keeps playing every time hover on image. missing? shouldn't sound stop playing?

do see other solution this?

cheers

the issue because event handler bound element. removing class after event bound not affect binding. affect event handler, can call off(), this:

$(".sound").click(function(){     $(".logo-image").off('mouseover'); }); 

alternatively, if want toggle sound functionality based on class, can keep current logic , check element still has class in mouseover handler:

$(".logo-image").mouseover(function() {     if ($(this).hasclass('play') {         mouseoversound.play();     } });  $(".sound").click(function(){     $(".logo-image").toggleclass("play"); });