qTip jQuery Plugin not always Firing

Question

Hi,

I am using the qTip jquery plugin qTip plugin for a website I'm working on based on another thread I raised here: stack overflow thread

My question is, I have a navigation bar running along the top of my screen which is basically sets the title attribute based on the tab menu you are in, these are all stored within a javascript array.

For example, I have three menu options running along the top of the screen, say Menu A, Menu B and Menu C.

I also have an information image positioned at the rightmost position of the nav bar, which I set the title attribute, based on the Menu option selected in the Nav Bar.

For example:

Menu A => myRole[0] = "Admin"
Menu B => myRole[1] = "Manager"
Menu C => myRole[2] = "Guest"

So basically as the user clicks on each of the menus in the nav bar, I set the title attribute in the information image to either "Admin","Manager" or "Guest".

At startup, the qTip plugin works and displays "Admin" when I hover over it but when I change the menu to Menu C, it still displays "Admin" instead of "Guest"

From the looks of it, it doesn't seem to be calling the qTip plugin, which I have positioned at the footer of the screen (see actual code below).

Any ideas how to ensure that the qTip fires every time I click/change menu options and pickups value within javascript array?

<script type="text/javascript" src="jquery.qtip-1.0.0-rc3.min.js"></script>



<script type="text/javascript"> 
$(document).ready(function()
{
   $('div#infoi img[title]').qtip({
      position: { 
         adjust: { x:-110, y:0 },
         corner: {
            target: 'bottomLeft',
            tooltip: 'topMiddle'
         }
      },
      style: {
        width: 250,
        padding: 5,
        background: '#E7F1FA',
        color: 'black',
        textAlign: 'center',
        border: {
          width: 3,
          color: '#65a9d7'
        },
        tip: 'topRight'
      }
   });
});
</script>

Thanks.