jquery popup needs to know which element caused the event

Question

I have the following javascript that uses the qtip library for creating a javascript pop up. I'm not sure how to gain access to which li element within the collection was clicked. Is this possible? I've added an alert box within the code below to help explain the problem. Let me know if you need anything else! Many thanks,

$('li').each(function () {
    $(this).qtip(
    {
        content: {
            text: 'test text',
            title: { text: true, button: '<img src="/Images/close.gif">' }
    },
    position: {
        corner: {
            target: 'rightMiddle',
            tooltip: 'leftMiddle'
        },
        adjust: {
            screen: true
        }
    },
    show: {
        when: 'click',
        solo: true
    },
    api: {
        beforeShow: function(index) {
            if(document.getElementById('basketCheck')) {
                alert('what LI caused this click?');
                return false;
            }
        }
    },
    hide: 'unfocus',
    style: {
        tip: true,
        border: {
            width: 0,
            radius: 4,
        },
        width: 264,
        height: 195,
        title: { 
            background: '#ffffff'
        },
        lineHeight: '16px'
    }
})

});

Answer 1

The triggering element is available in the elements.target property of the qTip instance. That instance, in turn, is bound to this in beforeShow handlers:

api: {
    beforeShow: function() {
        if(document.getElementById('basketCheck')) {
            // This <li> caused the click.
            var sourceElement = this.elements.target;  
            return false;
        }
    }
}