JSFiddle - React, Tailwind, and code Playground

by Michael Hughes

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<body>
    <h1>a heading</h1>
    <p>
        Some other text here&nbsp;<span data-toggle="tooltip" style="cursor: pointer" title="Some helpful text" class="right-tool-tip glyphicon glyphicon-question-sign"></span>
    </p>
 </body>

JavaScript

$(document).ready(function() {
    $('[data-toggle="tooltip"]').tooltip({
        'placement': 'right'
    });
    $('*').on('touchend', function(e){
        if ($(e.target).attr('data-toggle') != 'tooltip' && $('div.tooltip').length > 0){
            $('[data-toggle="tooltip"]').mouseleave();
            e.stopPropagation();
        } else {
            $(e.target).mouseenter();
        }
    });
});