JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" value="Tab to Button from here" id="btn" />
<input type="button" value="Button show/hide" id="btn" />
<div id="testElement">Section that you show/hide</div>

CSS

#testElement {
    padding-top: 25px;
    width: 200px;
    height: 50px;
    text-align: center;
    border: 2px solid #cccccc;
    margin: 15px;
}

JavaScript

var btn = $("#btn");
btn.on('click', function() { 
    $("#testElement").toggle('slow');
});
btn.on('focus', function() {
    $("#testElement").show('slow');
});
btn.on('blur', function() {
    $("#testElement").hide('slow');
});