Search code examples
djangotwitter-bootstraptwitter-bootstrap-2

Tooltip added by DOM manipulation is unable to render HTML


I am attempting to render the HTML in a tooltip, but unfortunately its not working at all.

This is how it has been programmed:

<div class="someField"></div>
<script>
    $(function () {
        $('.someField').append('<a href="#" data-html="true" data-toggle="tooltip" data-placement="top" title="<ul><li>Wee</li></ul>">(Example)</a>');
        $("body").tooltip({html:true,selector: '[data-toggle=tooltip]'});
    }); 
</script>

I have set data-html="true" in the link and furthermore enabled html in the tooltip parameter.

Whats wrong with my code?

UPDATE:

Bootstrap v2.3.1 is used for this project (old framework).


Solution

  • Try this:

     $("body").tooltip({ html: true, selector: '[data-toggle="tooltip"]' });
    

    WORKING DEMO