Twitter Bootstrap Popovers not working

Question

Here is my HTML:

<div id="disclaimer">After 30 Days you'll have the option to keep your account for $15 per month -no contract required-or revert to a single page free account.*</div>

JavaScript:

$('#disclaimer').popover({
  trigger: 'hover',
  html: true,
  placement: 'right',
  content: 'hello world'
});

When I hover over the element, nothing happens.. no JavaScript errors or anything, not sure whats wrong

Answer 1

Using your exact code, all I had to do to get it to work was wrap it in a function call and put the script below the div tag. If you placed your jQuery in an onload function it would work just as well. Good luck.

Use this:

<div id="disclaimer" >After 30 Days you'll have the option to keep your account for $15 per month -no contract required-or revert to a single page free account.*</div>

<script>
$(function ()  
{
  $('#disclaimer').popover(
  {
     trigger: 'hover',
     html: true,
     placement: 'right',
     content: 'hello world'
  });
});
</script>

OR

$(document).ready(function()
{
  $('#disclaimer').popover(
  {
     trigger: 'hover',
     html: true,
     placement: 'right',
     content: 'hello world'
  });
});

Answer 2

i had been looking for over a day as to why my popover wasn't working after getting autodisabled due to events happening on my page (a complicated app, something that gets enabled/disabled depending on the state of what is going on) and the key was to NOT have it the document ready but to have it out in a function because it gets enabled after document initialization on a button click.