toggle- hide item when click outside of the div

Stop event propagation from within the .showup area:

$(document).on("click", function () {
    $(".showup").hide();
});

Then prevent those clicks on .showup from bubbling up to the document:

$(".showup").on("click", function (event) {
    event.stopPropagation();
});

Any click event that reaches the document will result in the .showup element being hidden. Any click events that start from within .showup will be prevented from proceeding any further up the DOM tree, and thus will never reach the document.

You will also need to stop any clicks on your button from traveling up to the document as well:

$(".click").on("click", function (event) {
    event.stopPropagation();
    $(".showup").slideToggle("fast");
});

Otherwise that click event will bubble up to the document and result in the hiding of .showup immediately.

Demo: http://jsfiddle.net/evGd6/2/