multiple coda bubbles

multiple coda bubbles

Hello,
my goal is to have tooltips with the script 'coda' from here http://jqueryfordesigners.com/coda-popup-bubbles/
But I have separated trigger et popup like that :


<div class="bubble_trigger">
<a href="javascript:void(favoris()); " class="trigger" title="Ajouter cette page dans vos favoris" ><img src="./banniere/icone/favorite.png" alt="Favoris" width="22" height="22" /></a>
<a href="./forum/" class="trigger"  title="Visitez le forum"><img src="./banniere/icone/forum.png" alt="Forum" width="22" height="22" /></a>
</div>

<div class="bubbleInfo">
<img src="./banniere/icone/my_emote.png" alt="emote" width="22" height="22" />
<table id="dpop" class="popup" dont je passe le code >
  <div class="popup-contents">contenu</div>
</balises de fin de table>
</div>


So I have successfully adapted the code js of script 'coda'

$('.bubbleInfo').each(function () {
            var distance = 10;
            var time = 250;
            var hideDelay = 500;

            var hideDelayTimer = null;

            var beingShown = false;
            var shown = false;
            var trigger = $('.trigger', '.bubble_trigger'); //here!!
            var info = $('.popup', this).css('opacity', 0);


            $([trigger.get(0), info.get(0)]).mouseover(function () {
            title = $('.trigger').attr('title'); //here!!
            jQuery('.popup-contents').html(title); //here!!
            $('.trigger').attr('title',''); //here!!
                if (hideDelayTimer) clearTimeout(hideDelayTimer);
                if (beingShown || shown) {
                    // don't trigger the animation again
                    return;
                } else {
                    // reset position of info box
                    beingShown = true;
               pos = $('#dpop').findPos();
               info.css({

         top: -140,
                       left: -80,

                        display: 'block'
                    }).animate({
                        top: '-=' + distance + 'px',
                        opacity: 1
                    }, time, 'swing', function() {
                        beingShown = false;
                        shown = true;
                    });
                }

                return false;
            }).mouseout(function () {
                if (hideDelayTimer) { clearTimeout(hideDelayTimer); }
                hideDelayTimer = setTimeout(function () {
               title = $('.popup-contents').html(); //here!!
               $('.trigger').attr('title',title); //here!!
                    hideDelayTimer = null;
                    info.animate({
                        top: '-=' + distance + 'px',
                        opacity: 0
                    }, time, 'swing', function () {
                        shown = false;
                        info.css('display', 'none');
                    });

                }, hideDelay);

                return false;
            });
        });
    });


But I failed to apply this to all .trigger links : only the first one work. I'm a novice in js but i like the way to do of jquery. Can you help me please ?[/code]