Edit in JSFiddle

var createTooltip = function( sSelector )
{
    $.each( $(sSelector), function() 
    {
        if ( this.scrollWidth > this.clientWidth ) 
        {
            this.title = $(this).text().replace(/^\n|\r|\s+/g," ").trim() // firefox does not support innerText yet
        }
    });
}

createTooltip('.truncate dd');
    
<dl class="truncate">
    <dt>Name</dt>
    <dd>Patrick</dd>
    <dt>Twitter</dt>
    <dd><a href="http://www.twitter.com/netzaffin">@netzaffin</a></dd>
    <dt>Website</dt>
    <dd><a href="http://www.netzaffin.de">www.netzaffin.de</a></dd>
    <dt>Slogan</dt>
    <dd>hover me to read some bleeding edge web stuff</dd>
</dl>
.truncate dt {
    width: 100px;
    float: left;
}

.truncate dd {
    overflow: hidden;
    text-overflow: ellipsis;
    width: 200px;
    white-space: nowrap;
}