I am showing a hidden login div using a simple jquery function on click.

```
function showLog(){
 $('#signin_menu').slideDown();
}

```

How would I edit this to hide the div when the user clicks outside of the box?

**The div html** (if needed)

```
<div id="signin_menu" >
 <p>
      <label for="email">Email</label>
      <input type="email" name="email" id="email" tabindex="4" title="email">
      </p>
      <p>
        <label for="password">Password</label>
        <input type="password" name="password" id="password" title="password" tabindex="5">
      </p>
      <p class="remember">
         <input type="button" class="button-link" name="submit" style="cursor:pointer" id="submit" value="Log In" onclick="logMeIn()" tabindex="6">

        <input id="remember" name="remember_me" value="1" tabindex="7" type="checkbox">
        <label for="remember">Remember me</label>
      </p>

  </div>

```