[jQuery] cluetips only loads the first tip but not the rest

[prince]

This is what I have in the head:

<script type="text/javascript">
$(document).ready(function() {
  $('a.tip1').cluetip();
  $('a.tip2').cluetip();
  $('a.tip3').cluetip();
});
</script>


In the body I have:

<a class="tip1" href="#" title="Host Team" rel="mylink1.html">learn
more</a>
<a class="tip2" href="#" title="Host Team" rel="mylink2.html">learn
more</a>
<a class="tip3" href="#" title="Host Team" rel="mylink3.html">learn
more</a>

It only loads the first tip, if I switch tip2 to the top where tip1 is
in the head it only loads tip2. Not sure what's going on... thanks for
any help in advance!