Problem with JQuery live and html click event

I've a problem with JQuery live() function. I've built a share-link with a click event and if you click on the link it pops up a little div with the short URL and like buttons. The share-link is over the pop-up div container (z-index) and if you click a second time on it the pop-up div should be disappear. But the pop-up div should be also disappear when you click outside of the pop-up div.

here is the l开发者_JS百科ink to the JSFiddle (if you replace live with bind it works fine, but I need the live function). http://jsfiddle.net/Borsti/MXyGR/

And the JS-Code extra:

$('.share').live('click', function(event) {
        var button = $(this);
        var container = $(this).next('.sharecontainer');
        var mouse_is_inside = false;
        //alert("clicked!");
        container.toggle();
        button.toggleClass('sel');

        container.hover(function(){
            mouse_is_inside = true;
        }, function(){
            mouse_is_inside = false;
        });

        $('html').click(function() {
            if(!mouse_is_inside) {
            container.hide();
            button.removeClass('sel');
            }
        });
        return false;                
});

I hope you could understand me, my English is not the best ;)

Well, when using live() for the link you also have to use it for the global html:

$('html').live("click", function() {
    if (!mouse_is_inside) {
        container.hide();
        button.removeClass('sel');
    }
});

Updated jsFiddle: http://jsfiddle.net/MXyGR/3/

Try the following,

http://plugins.jquery.com/plugin-tags/div-popup