jquery-vysvětlivka se nezobazuje když dynamicky přidávám kod

Mam stazeny plugin z http://plugins.learningjquery.com/cluetip/ - na tvorbu vysvtlivek

tady je priklad:
nacteni knihoven..
$(document).ready(function() {
$('#clue').cluetip({
splitTitle: '|', // use the invoking element's title attribute to populate the clueTip...
// ...and split the contents into separate divs where there is a "|"
showTitle: false // hide the clueTip's heading
});
});
$(document).ready(function(){
$("#button").click(function (event) {

var newRow='<li><span id="clue" title="title|description">tady vysvetlivka při najetí myší NEfunguje</span></li>';
$('#ul').append(newRow);
event.preventDefault();
});

...html
<ul id="ul">
<li><span id="clue" title="title|description">tady vysvetlivka při najetí myší funguje </span></li>
</ul>
<button id="button">click</button>

Uz mi dosli napad na reseni tohoto problemu. diyk za napady