Mouse event Add and Remove Classes

jQuery example: Add and Remove Classes of elementts by mouseover and mouseout

by ITpresent

HTML

<img class="u" src="https://websitebackgrounds.itpresent.com/drawing/images/class_bu.jpg">
  <img class="v" src="https://websitebackgrounds.itpresent.com/drawing/images/class_bv.png">
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
<a href="https://itpresent.com/web/jquery/jquery_addclass_removeclass.php"       target="_blank">jQuery example: Add and Remove Classes of elementts by mouseover and mouseout</a>

CSS

.u {background-image:url("https://websitebackgrounds.itpresent.com/drawing/images/class_bu.jpg");}
.v {background-image:url("https://websitebackgrounds.itpresent.com/drawing/images/class_bv.png");}
img {
  width: 200px;
  height: 100px;
  margin:50px;
  }

JavaScript

$(document).ready(function(){
     $("img").mouseover(function(){
             $("body").addClass(this.className);    
         })
          .mouseout(function(){
    $("body").removeClass(this.className);
         });
     });