Redondeando la idea de @chuidiang, dependiendo del contenido de tu "body" puede que no te funcione correctamente, es preferible que se lo apliques al html completo
imaginate este ejemplo
Código HTML:
Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script type="text/javascript"> //<![CDATA[
$(document).ready(function(){
$(".contenido-a-mostrar").hide();
$(".mostrar").click(function(event){
$(".contenido-a-mostrar").toggle();
$(this).toggleClass("active");
event.stopPropagation(); // Para evitar que llegue también al body.
});
$("html").click(function(){ // reemplaza html por body
$(".contenido-a-mostrar").hide();
});
});
//]]>
<a href="#" class="mostrar">Mostrar Contenido
</a> <div class="contenido-a-mostrar"> <p>Este contenido esta oculto
</p>
Saludos