JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta>
</head>
<body>
    <input id="input-enabled" class="hover-this" type="text" value="input enable" />
    <br /><br />
    <input id="input-disabled" class="hover-this" type="text" value="input disable" disabled="disabled" />
</body>
</html>

CSS

* {}

JavaScript

$(document).ready(function(){
    // Choose one or the other
    /*$('.hover-this').bind('mouseover', function(){
        $(this).css({border: '1px solid red'});
    });*/
    
    $('.hover-this').hover(function(){
        $(this).css({border: '1px solid red'});
    }, function(){
        $(this).css({border: '0px'});
    });
});