qTip2 - My test case

HTML

<script src="http://craigsworks.com/projects/qtip_new/packages/nightly/jquery.qtip.js"></script>
<link rel="stylesheet" href="http://craigsworks.com/projects/qtip_new/packages/nightly/jquery.qtip.css">
<a href="#test" class="tooltip" title="Content 1">qTip 1</a>
<a href="#test" class="tooltip" title="Content 2">qTip 2</a>
<a href="#test" class="tooltip" title="Content 3">qTip 3</a>

<br/>

<a href="#c1" class="tooltip2" title="Content 1">qTip 1</a>
<a href="#c2" class="tooltip2" title="Content 2">qTip 2</a>
<a href="#c3" class="tooltip2" title="Content 3">qTip 3</a>


<div id="c1" style="display:none;">content qTip 1</div>
<div id="c2" style="display:none;">content qTip 2</div>
<div id="c3" style="display:none;">content qTip 3</div>

CSS

body {
    font-family: "Inconsolata","Monaco","Consolas","Andale Mono","Bitstream Vera Sans Mono","Courier New",Courier,monospace;
    font-size:12px;
    line-height:15px;  
}

JavaScript

$(document).ready(function() {

    // use title attribute
    $(".tooltip").qtip({
        position: {
            corner: {
                target: 'topRight',
                tooltip: 'bottomLeft'
            }
        }
    });

    
    // use jquery selector
    $(".tooltip2").each(function() {
        
        var content = $($(this).attr("href")).html();
        

        $(this).qtip({
            content: content,
            position: {
                corner: {
                    target: 'topRight',
                    tooltip: 'bottomLeft'
                }
            }
        });
    });

});