JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">

    <input id="field" type="text" placeholder="Focus on me, then click the button.">
    
    <button id="submit_button">Click Me!</button>
    
    <div id="log"></div>
    
</div>

JavaScript

function log(message) {
    
    $( "#log" ).append( "<br>" + message );    
    
}

$( document ).on( "click", "#submit_button", function() {
   
    log( "Submit button clicked." );
    
});

$( "#field" ).blur(function( event ) {
    
    if ( event.relatedTarget == $( "#submit_button" ).get(0) )
    {
         return false;   
    }
    
    log( "Input field blurred." );
    
});