title: Prevent certain elements from receiving focus
body: <p>So I have the following function. What it does is listens for the focus event on all elements. If that element is either in <code>$mobileMenu</code> or <code>$menuItems</code> it permits it otherwise it removes the focus:</p>
  
  <pre><code>var $body = $("body");
  var $mobileMenu = $("#mobile-menu");
  var $menuItems = $("#main-menu a");
  
  $body.on("focus.spf", "*", function(e){
    e.stopPropagation();
    $this = $(this);
  
    // Prevent items from recieving focus and switching view
    if (!$this.is($mobileMenu) &amp;&amp; !$this.is($menuItems)) {
      $this.blur();
    } else {
      console.log(this);
    }
  })
  </code></pre>
  
  <p>The issue I have is that this prevents the user from focusing on anything whatsoever if a normally focusable element that is now non-focusable precedes any of my white-listed elements as it just attempts to refocus on the same element over and over again.</p>
  
  <p>Does anyone know how I can tell it to instead skip to the next focusable element? </p>