JSFiddle - React, Tailwind, and code Playground
HTML
Chrome 43: focusout fired<br />
Safari 8: focusout fired<br />
Firefox 38: focusout NOT fired.<br />
Expected: event NOT fired.<br />
<div id="wrapper"><input type="text" id="input" /></div>
CSS
body {
padding: 10px;
font-family: Helvetica, Arial;
font-size: 14px;
line-height: 20px;
}
#wrapper {
padding: 10px 0;
}
JavaScript
$('#wrapper').on('keyup', 'input', function() {
$('#wrapper').html('');
});
$('#wrapper').on('focusout', 'input', function(e) {
// This shouldn't be hit after typing letter in box
$('body').append('<div>Delegation: ' + e.type + '</div>');
});
$('#input').focus();
setTimeout(() => $('#input').remove(), 3000);