Question

  <div class="btn-group">
   <button class="btn dropdown-toggle" data-toggle="dropdown"> Reviews </button>
   <button class="btn dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
   <ul class="dropdown-menu">
      <li><a href="#" id="reviewhover" rel="popover" placement="right" data-content="Reviewer:testuser is too good, too cool, too sad, too bad, too right, too wrong">testuser 2012/08/12 12:25:42:836 PM</a></li>
      <li><a href="#" id="reviewhover" rel="popover" placement="right" data-content="Reviewer:testuser11 is too">testuser11 2012/08/13 12:25:42:836 PM</a></li>
    </ul>
 </div>​

I am using bootstrap.min.js v2.0.4 and jquery 1.7.2, tried with jquery 1.8.0 and 1.7.1 with same results

I have this js code in tbspopover.js –

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

Script Order

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script src="/vendor/bootstrap.min.js"></script>
<script src="/js/views/tbspopover.js"></script>

Answer 1

The js function to enable popover was called before the element was added to DOM. The DOM element wasn’t added until after ajax call was done. Found a tip here