JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://getfirebug.com/firebug-lite-debug.js"></script>
<input id="tab" name="tab" value="Tab From Here" type="text" class="inputstyle" /> 
<br/>
<input id="out" name="out" value="Click For Focus" type="text" class="inputstyle" />
<br/>
<input type="button" id="button" value="Programmatic Focus" class="buttonstyle" />

CSS

.inputstyle {
    margin-bottom:8px;
}
.buttonstyle {
    background-color:#5fb5be;
}

JavaScript

$('#out').focus(function() {
    $(this).select();
});

$('#out').on('mousedown.selectOnFocus', function() {
    if (!($(this).is(':focus'))) {
        $(this).focus();
        $(this).one('mouseup.selectOnFocus', function(up) {
            up.preventDefault();
        });
    }
});

$('#button').click(function() {
    $('#out').focus();
});