Bootstrap 2.3.2 Skeleton

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css">
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="navbar-inner">
        <div class="container">
            <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
            </button> <a class="brand" href="#">Bootstrap 2.3.2 Skeleton</a>
            <div class="nav-collapse collapse">
                <ul class="nav">
                    <li class="active"><a href="#">Home</a>
                    </li>
                    <li><a href="#about">About</a>
                    </li>
                    <li><a href="#contact">Contact</a>
                    </li>
                </ul>
            </div>
            <!--/.nav-collapse -->
        </div>
    </div>
</div>



<!-- Post Info -->
<div style='position:fixed;bottom:0;left:0;    
            background:lightgray;width:100%;'>
    Find documentation: <a href='http://getbootstrap.com/2.3.2/base-css.html'>Get Bootstrap 2.3.2</a><br/>
    Fork This Fiddle Here: <a href='http://jsfiddle.net/KyleMit/xamHD'>Bootstrap 2.3.2 Skeleton</a><br/>
    External JS File: <a href='http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js'>bootstrap.min.js</a><br/>
    External Style Sheet: <a href='http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css'>bootstrap-combined.min.css</a>
<div>

JavaScript

$(".btn.btn-navbar").hover( function() {
    
     console.log(this);

                    $.ajax({
                            type:"POST",
                            url: "/echo/html/",
                            data: { u : 'http://stackoverflow.com' },
                            dataType: 'html',    
                            error: function(jqXHR, textStatus, errorThrown) {
                                console.log('error');
                                console.log(jqXHR, textStatus, errorThrown);
                            }
                        }).done(function(html) {
                           console.log(' here is the html ' + html);
                        

                    
                    $link = $('<a href="myreference.html" data-html="true" data-bind="popover"' + ' data-content="'+html +'">');
                    
                    console.log('$link',$link);
                    $(this).html($link);

                  
                
                // Trigger the popover to open
                $link = $(this).find('a');
                $link.popover("show");
                       })

            

                
                
            }, function() {
               console.log('hover off');

            });