Hello Reader's! If you want to make a html page that based on user activity, As user clicks on div then JS will make that div highlight.

Let's say our div is -

 <div tabindex="0">Hello World</div>

Here div with tabindex of 0 will put the tag "in the natural tab order of the page".

You can also give a tabindex of -1, which will make the div only focus-able by script, not the user.

document.getElementById('test').onclick = function () {
    document.getElementById('scripted').focus();
};
div:focus {
    background-color: Aqua;
}
<div>Element X (not focusable)</div>
<div tabindex="0">Element Y (user or script focusable)</div>
<div tabindex="-1" id="scripted">Element Z (script-only focusable)</div>
<div id="test">Set Focus To Element Z</div>

Note:- A higher number will give it a specific order of priority, where 1 will be the first, 2 second and so on.