Trigger jquery function on blur unless specific elements are clicked
<p>I have a login form. When the inputs get focused the "forgotten password" and "remember me" elements get shown by adding a css class, when they blur, the elements are hidden again by removing the class "sho". I would like the elements to keep the class "<code>show</code>"if I click either one of them or the login link</p>

<pre><code>$(document).ready(function() {
    $('.login *').focus(showlogin);
    $('.login *').blur(hidelogin);
});


function showlogin(){
    $('.login .hidden').addClass("show");
}

function hidelogin(){
    $('.login .hidden').removeClass("show");
}
</code></pre>

<p>Html:</p>

<pre><code>&lt;form class="login"&gt;
  &lt;input type="text"/&gt;
  &lt;input type="password"/&gt;
  &lt;a class="loginbutton" href="#"&gt;Log in&lt;/a&gt;
  &lt;br /&gt;
  &lt;a class="hidden" href="#"&gt;Forgotten password&lt;/a&gt;
  &lt;label class="hidden"&gt;&lt;input type="checkbox" /&gt; Remember me&lt;/label&gt;
&lt;/form&gt;
</code></pre>
