title: find the next with jquery when no sibling
body: <p>After I enter the <code>maxlength</code> number of characters in an input I need to focus on  the next input. The issue is that the next input is not always a sibling:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>jQuery("input").on('input', function() {
    if (jQuery(this).val().length == jQuery(this).attr('maxlength')) {
      jQuery(this).next("input").focus();
    }
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  When you have write 4 char, the focus have to switch to the next input:
  &lt;div&gt;
    OK
    &lt;input maxlength="4"&gt;
    &lt;input maxlength="4"&gt;
  &lt;/div&gt;
  KO
  &lt;input id="inputWithTheIssue"&gt;</code></pre>
  </div>
  </div>
  </p>