JSFiddle - React, Tailwind, and code Playground

HTML

<div  style="left: 10px; top: 10px"></div>
<div  style="left: 17px; top: 23px"></div>

    
<div style="left: 50px; top: 60px"></div>

CSS

div { width: 10px; height: 10px; background: red; position: absolute }
div.selected { background: green }

JavaScript

jQuery(function(){
    var div;
       
    $(document).keydown(function(e){
       // if(!div) return;
        
        switch(e.which){
            case 37:
                div.css('left', div.offset().left - 10);
                console.log(e);
                break;
            case 38:
                div.css('top', div.offset().top - 10);
                break;
            case 39:
                div.css('left', div.offset().left + 10);
                break;
            case 40:
                div.css('top', div.offset().top + 10);
                break;
        }
    });
    
    $(document).click(function(e){
        console.log(div);
        if(div)
            div.removeClass('selected');        
       div = null;
      
    });
    
    $('div').click(function(e){
        div = $(this);
        div.addClass('selected');
        return false;
    });
});