JSFiddle - React, Tailwind, and code Playground

HTML

<div class="frame"></div>
<div class="frame"></div>
<div class="frame"></div>
<div class="frame"></div>

CSS

.frame{
    height:200px;
    width:200px;
    border-style:solid;
    border-width:1px;
}

JavaScript

$(document).on('mouseenter mouseleave', '.frame', function( e ) {
    var el=$(this);
    if(e.type == "mouseenter"){
        if (!el.data('originalheight')) el.data('originalheight', el.height()); // set the data
        el.stop().animate({background: '#ddd'});
    }else{
        el.stop().animate({height:el.data('originalheight')});
    }  
});