How to stop an element from fading out?
<p>I have a tooltip which appears then disappears after a couple of seconds.</p>

<pre><code>function tooltip(msg) {
    tooltipStart(msg);
    tooltipExit();
}

function tooltipStart(msg) {
    $('body').append('&lt;div id="tooltip"&gt;'+msg+'&lt;/div&gt;');
    $('#tooltip').fadeIn(300);
}

function tooltipExit(duration) {
    if ( ! duration) {
        duration = 2000;
    }

    $('#tooltip').delay(duration).fadeOut(1000, function() {
        $('#tooltip').remove();
    });
}
</code></pre>

<p>I now want the tooltip to not fade out and be 100% opaque if the user hovers over the tooltip.</p>

<p>Do I need to rewrite the way the tooltip works or is there a way to stop the tooltipExit function when the mouse hovers over it?</p>
