JSFiddle - React, Tailwind, and code Playground

by seankoole

HTML

<img
 class="video-play"
 src="https://venturity.com/wp-content/themes/venturity/assets/images/play-btn.svg"
 data-hover="https://venturity.com/wp-content/themes/venturity/assets/images/play-btn-hover.svg"
 >
 
 
 <div class="foo-bar">
   
 </div>


<div id="foo-bar"></div>


<div id="a">
  
</div>

CSS

body {
  background: black;
}

JavaScript

jQuery(function() {
 $('.video-play')
   .mouseover(function() {
     $(this).attr('src', $(this).data('hover'));
   })
   .mouseout(function() {
     $(this).attr('src', $(this).data('src'));
   });

})