JSFiddle - React, Tailwind, and code Playground

by klodder

HTML

<input type="button" onclick="focusFoo()" value="focus">

<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>


<input type="button" onclick="focusFoo()" value="focus">
<input type="button" onclick="focusBar()" value="un focus"></br>
<div id="focushere" tabindex="-1">focus on this</div>

CSS

div:focus
{
color:orange;
}

JavaScript

function focusFoo()
{
    document.getElementById('focushere').focus();
}

function focusBar()
{
    document.getElementById('focushere').blur();
}