JSFiddle - React, Tailwind, and code Playground

HTML

<div id="focusedDiv">TEST</div>

CSS

textarea.div-text-area {
    overflow-y:scroll;
    background:white;
    color:#333;
    padding:5px;
    border:#999 1px solid;
    transition: all 0.25s ease-in-out;
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    box-shadow: 0 0 5px rgba(81, 203, 238, 0);
    -webkit-box-shadow: 0 0 5px rgba(81, 203, 238, 0);
    -moz-box-shadow: 0 0 5px rgba(81, 203, 238, 0);
}
textarea.div-text-area:focus {
    color:#000;
    outline:none;
    border:#35a5e5 1px solid;
    box-shadow: 0 0 5px rgba(81, 203, 238, 1);
    -webkit-box-shadow: 0 0 5px rgba(81, 203, 238, 1);
    -moz-box-shadow: 0 0 5px rgba(81, 203, 238, 1);
}
textarea.div-text-area p {
    margin: 0 0 0.5em 0;
}

JavaScript

$("#focusedDiv").css('outline', 0).attr('tabindex', -1).focus(function () {
     console.log('focus');
});

$("#focusedDiv").focusout(function () {
        console.log('focusout');      
    });