DELETE ME

by bizamajig

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<ul>
    <li> <a href="#" class="btn" data-toggle="popover" data-content='<div class="btn-group"> <button class="btn">Left</button> <button class="btn">Middle</button> <button class="btn">Right</button> </div>' data-placement="bottom" title="">Popover</a>

    </li>
    <li> <a href="#" class="btn" data-toggle="popover" data-content='<div class="btn-group"> <button class="btn">111</button> <button class="btn">222</button> <button class="btn">333</button> </div>' data-placement="bottom" title="">Popover</a> 
    </li>
</ul>

CSS

body {
    padding: 50px;
}

JavaScript

$(document).ready(function(){

    $('.btn').popover({

        trigger: 'click'
}).click(function(e) {
    $(this).popover('toggle');
    e.stopPropagation();
});


   $('.btn').on('click', function (e) {
       $('.btn').not(this).popover('hide');
    });
});