qtip jquery click not invoking on element inside tooltip

Question

I'm using jquery qtip (http://qtip2.com/)

its working well, i have a number of divs inside with classes

I'm trying to to invoke a click function on these divs

qtip:

 var tipContent = $('#tip-content').html();
    $('#obsglass').qtip({
        content: {
            text: tipContent
        },
        show: {
            effect: function() {
                $(this).fadeTo(500, 1);
            },
            event:'click'
        },
        hide: {
            effect: function() {
                $(this).slideUp();
            },
            event:'click unfocus'

        },
        //show: 'click',
        //hide: 'click unfocus',
        style: {
            classes: 'qtip-bootstrap qtip-shadow',

        },

        position: {
            my: 'center left',  // Position my top left...
            at: 'center right', // at the bottom right of...
            target: $('#obsglass') // my target
        },


    });

Click function

 $(".obsglass-thumbnail").click(function () {

... Not entering this function when clicking the divs in the tool tip

Answer 1

Seem like your elements have been added dynamically to the DOM by the plugin, try to use event delegation here:

$(document.body).on('click','.obsglass-thumbnail',function() {
    // Your code here
})

Answer 2

Instead of ,

 $(".obsglass-thumbnail").click(function () {})

Use delegate :

 $(document).delegate(".obsglass-thumbnail","click",function () {})

Because , IF HTML elements were added after loading Click event , Your event is not useful for those elements.