Обновляет текст всплывающей подсказки sh jQuerty при нажатии кнопки

Question

У меня есть всплывающая подсказка jQuery на кнопке. Когда кнопка нажата, ее функция переключается между двумя состояниями, и, следовательно, текст подсказки должен быть изменен или, возможно, полностью удален. Я могу легко изменить текст всплывающей подсказки с помощью:

$('#my_button_id').tooltip('option', 'content', 'New Tooltip Text');

Но новый текст отображается только после того, как я наведу курсор мыши, а затем снова на кнопку. Это означает, что в тот момент, когда кнопка нажата, заголовок кнопки изменяется, но подсказка остается в своем предыдущем состоянии. Следовательно, они несовместимы.

У меня есть фрагмент ниже:

<script>
    $(
        function() {
            $( '#btn' ).tooltip({content: tooltip()});
        }
    );

    function tooltip () {
        return 'Tooltip';
    }

    function my_click() {
        var btn = document.getElementById('btn');

        if (btn.value == 'Showing Tooltip') {
            btn.value = 'Hideing Tooltip';
            $('#btn').tooltip('option', 'content', '');
            $('#btn').tooltip('close');
            $('#btn').tooltip('open');
        } else {
            btn.value = 'Showing Tooltip';
            $('#btn').tooltip('option', 'content', tooltip());
            $('#btn').tooltip('close');
            $('#btn').tooltip('open');
        }
    }
</script>

, который мучительно близок к работе. Изначально (при наведении курсора) отображается подсказка. При первом нажатии кнопки подсказка исчезает. При втором нажатии кнопки он появляется снова, но в тот момент, если я наведите курсор мыши, а затем снова наведите курсор мыши, он не вернется. У кого-нибудь есть идеи по этому поводу?