Question

How can make a tooltip with jquery and css for following HTML? (i mean, this is that when mouse enter on li a displaying content class show_tooltip)

<ul>
    <li>
    <a href="#">about</a>
    <div class="show_tooltip">
        put returns between paragraphs
    </div>
    </li>
    <li>
    <a href="#">how</a>
    <div class="show_tooltip">
        for linebreak add 2 spaces at end
    </div>
    </li>
</ul>

Answer 1

$("li a").mouseover(function(){
     $(this).next().fadeIn();
})
$("li a").mouseout(function(){
     $(this).next().fadeOut();
})