How to solve the problem with the focus?

Has input focus and the input which the tooltip help in the block with the class helps below.
And when you focus loss tips closed.
$('body').on('focus input', 'input', function () {
 var params = {
 data: $(this).val()
};
$.ajax({
 type: "POST",
 url: "...",
 data: params
})
 .done(function (data) {
 // if there are tips
 if (data.length != 0) {
$(".helps").html(data).slideDown(100);
}
});
 }).on('focusout', 'input', function () {
$(".helps").slideUp(100);
 });

And when you click on tooltip I want to fill input automatically.
$('body').on('click', '.help', function () {
 var info = ... ;
$('input').val(info);
 });

But for some reason it works very rarely. I understand when you click on the hint we lose focus and fires the code that closes the tooltip. And click is not happening. But somewhere in 1 of 10 cases the code works. So how can there be?
sandbox
June 10th 19 at 14:50
1 answer
June 10th 19 at 14:52
Solution
instead
$('body').on('click', '.help'
make
$('body').on('mousedown', '.help'

Find more questions by tags jQueryJavaScript