Question

i was using tooltip and it is working perfectly, but it seems like my html was not validated properly due to the rel=’tooltip’ not being a correct value.

so, I changed my code as following

<a href="#" data-tooltip="tooltip" title="under construction" class="line-through tooltip-flag">Blog</a>

and my javascript as following

$("a[data-tooltip=tooltip]").tooltip();

but that did not work and when i tried to force it $(“a[data-tooltip=tooltip]”).tooltip(‘show’); i got a js error. so, I assumed the tooltip.js requires to see the rel=’tooltip’ field. so, I replaced it with the following code

$(document).ready(function() {

    // initialize all tooltips
    $("[data-tooltip=tooltip]").attr('rel', 'tooltip');
    $("[data-tooltip=tooltip]").queue(function(){
        $("a[data-tooltip=tooltip]").tooltip();
        $(this).dequeue();
    });

});

but still am not able to get the tooltip to work, any ideas?

UPDATE:
below is the JS error am getting

data[option] is not a function
[Break On This Error]   

if (typeof option == 'string') data[option]()

Answer 1

This error is because you are overriding the internal instance data of bootstrap tooltip. Using anything else should work:

data-my-tooltip="something"

Do not use:

data-tooltip="something"

This said, you do not need the data or rel at all. You could simply give the links a class class="this-is-a-tooltip" and then call $(".this-is-a-tooltip").tooltip()