javascript - How do I detect when a div has lost focus? -

Looking at the following markup, I want to know when an editor loses focus:

  & lt; Div class = "editor" & gt; & Lt; Input type = "text" / & gt; & Lt; Input type = "text" / & gt; & Lt; / Div & gt; & Lt; Div class = "editor" & gt; & Lt; Input type = "text" / & gt; & Lt; Input type = "text" / & gt; & Lt; / Div & gt; & Lt; Button & gt; GO & lt; / Button & gt; Edit           through the input elements in the form of the user tab and each editor div focus (which means they lose div out tabs) / P> 
  $ (".editor"). Blur (function ()).  
 {$ (This) .addClass ("Loading");});   
 It starts working, as long as you add console logs and do not feel that it is triggering on every focal point of the input.  
  $ ('div.editor input () {$ (this) .Parent () .addClass ("centric"). Focusout (function () {console.log (' focusout ') ; $ (This) .removeClass ("centric") .addClass ("loading");});});   
 In the case of my trial that I am working, I know that I am missing the basic thing here. Can anyone illuminate me?  
  Edit:  After some comments given below, I have liked to do it almost all the way. The problem is now finding when the focus editor changes somewhere out of the place. Here's my current implementation:  
  function load data () {console.log ('Loading data for editor' $ (This) .attr ('id')); Var $ editor = $ (this) .removeClass ('Load') .addClass ('Load'); $ .post ('/ echo / json /', {delay: 2}) .done (function () {$ editor.removeClass ('loading') .addClass ('loaded');}); } $ ('Div.editor input'). ('Focusin', function () {console.log ('Focus changed'); $ editor = $ (this) .closest ('. Editor'); console.log ('current editor is' + $ editor.attr ( 'Id')); if ($ editor.hasClass ('centric')) {console.log ('switched editor'); $ ('. Editor.focused') .removeClass ('centric') .each (LoadData); $ editor.addClass ('centric');}})   
 A bit more complex, and using classes for the state. I have also added to the next bit of complexity which is to create an async call, when an editor loses focus, my current work   
 
 
 If you want to treat the entries and  in the form of inputs  if they are joined in the same control, then you have to see whether the element The  get  focus is in the same  editor . You can do this so that checks are delayed by a cycle using the  setTimeout  of 0 (which is waiting till all existing works are completed).  
  $ ('div.editor input'). Focus Out (function () {var $ editor = $ (this) .closest ('. Editor'); // Wait for the new element setTimeout Focus (function () {// See if the new Focus element is in the editor ($ Adds $ editor.addClass ("centric"). RemoveClass ("loading");} and {$ editor.removeClass ("centric") .addClass ($ editor [0], document. ("Loading");}}, 1);}); Jeffield:  
 To complete the puzzle (get your initial green stage), you should see the  Foccin  Catching the event You will need to see if it is  to  or not the same editor (save the last focused element in a global etc)  
 Side note: I recently got a jQuery This was done for groups of elements which had to be written in the plugin.  
  Update 1:  This custom  group focus  and  group blur  makes events easier to make other codes easier.   
 Depending on your new example, you will be repeatedly  Hoksin can  grip, so it is not necessary for all after having the previous focus look. Using my previous set, the example of timetime resolves the problem of clicking outside the divs.  
  $ ('div.editor input'). Focusin (function () {var $ editor = $ (this) .classest ('editor'); $ editor.addClass ("centric"). RemoveClass ("loading");}). Focus Out (function () {var $ editor = $ (this) .closest ('. Editor'); // Waiting for new element to focus on setTimeout (function ()) {// See that the new focused element editor ($ $ Editor [0], document.activeElement) {$ editor .removeClass ("centric"). Each (load data);}}, 0);});