title: How to remove focus from activeElement when changing tabs (onfocus/onblur)?
body: <p>I'm trying to remove focus from a (jQuery Mobile) text input when a user switches tabs on desktop. While I can correctly identify the activeElement in the below console, I cannot edit any of its properties or remove its focus.</p>
  
  <p>This is what I'm doing:</p>
  
  <pre><code>// inside some init method        
  
  window.onfocus = function () {
    // triggers
    console.log(document.activeElement);
    if (document.activeElement.tagName !== "BODY") { 
      console.log("clear focus");   
      document.activeElement.blur();
      document.activeElement.className = "FOOBAR";
    }
  };
  </code></pre>
  
  <p>When I'm on a form and focus a text input, then switch to another tab and go back to the tab with the form, the event listener triggers and my still active input is correctly logged. However that's it... I can't blur or edit any of the elements properties.</p>
  
  <p><strong>Question</strong>:<br>
  How do I correctly remove focus from the active element either on <code>window.onfocus</code> or <code>window.onblur</code>? </p>
  
  <p>Thanks!</p>
  
  <p>PS: it also does not work with jQuery:</p>
  
  <pre><code>$(window).on("focus", function () {
    $(document.activeElement).blur();
  });
  </code></pre>
  
  <p>and I'm looking for a JavaScript only solution.</p>
  
  <p><strong>EDIT</strong>:<br>
  <code>document.activeElement.blur()</code> works fine from the console, but not from my listener.</p>