Question

What am i doing wrong here?

I tried it in a larger project and couldnt get it to work either

see my jsfiddle

http://jsfiddle.net/keithmancuso/24RQM/

UPDATE: ok so i got it working if i manually add $(“.pop”).popover(); but do i have to initalize them like that?

I think the answer is yes… you do have the initialize them in your own code to get it to work… the easiest way i’ve found to do this is just add

$(function() {
    $('a[rel="popover"]').popover();
});

Answer 1

I had a similar problem. Was looking for a javascript-less version of the bootstrap popup but it doesn’t seem possible. If you look at the page source of http://twitter.github.com/bootstrap/javascript.html#popover
at line 709-718 you will see that the example does something similar:

Heres a simplified version that works for me

<a href="#" class="btn danger" 
            rel="popover" 
            data-original-title="title" 
            data-content="content">popover</a>
<script>
  $("a[rel=popover]").popover();
</script>

Edit: for recent versions of twitter boostrap (right now 2.2.1) you might run into a problem where when you click on a popover link, you are taken to the top of the page.
This answer might be beneficial too https://stackoverflow.com/a/13759775/341692 . Basically your js should now be

<script>
$("a[rel=popover]")
    .popover()
    .click(function(e) { 
        e.preventDefault(); 
    });​
</script>