title: How to get the nth previous or next element in Jsoup
body: <p>Is there is anyway to get the <strong>nth</strong> previous or next specific HTML element that could possibly be on a different nesting level using jsoup?</p>
  <h3>HTML example:</h3>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div style="position: relative;"&gt;
    &lt;div class="wmd-container"&gt;
      &lt;div id="wmd-button-bar-42" class="wmd-button-bar"&gt;&lt;/div&gt;
      &lt;input id="previousInput" name="communitymode" type="checkbox"&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="fl" style="margin-top: 8px; height: 24px;"&gt;&amp;nbsp;&lt;/div&gt;
  &lt;div id="draft-saved-42" class="draft-saved community-option fl" style="margin-top: 8px; height: 24px; display: none;"&gt;draft saved
  &lt;/div&gt;
  
  &lt;div id="draft-discarded-42"&gt;draft discarded&lt;/div&gt;
  
  &lt;div class="community-option g-row ai-center f-checkbox"&gt;
    &lt;div class="g-col -input"&gt;
      &lt;input id="NextInput" name="communitymode"&gt;
    &lt;/div&gt;
    &lt;div class="g-col"&gt;
      &lt;label for="communitymode-42"&gt;community wiki&lt;/label&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>For example in below HTML I am pointing the element:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="draft-discarded-42"&gt;draft discarded&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>by using below code.</p>
  <pre><code>Element elem = doc.select(&quot;div[id=draft-discarded-42]&quot;).first();
  </code></pre>
  <p>I want the <strong>first previous</strong> <code>input</code> element:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;input id="previousInput" name="communitymode" type="checkbox"&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>And the <strong>second previous</strong> <code>div</code>:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="fl" style="margin-top: 8px; height: 24px;"&gt;&amp;nbsp;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>And the <strong>second next</strong> <code>div</code>:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="g-col -input"&gt;
    &lt;input id="NextInput" name="communitymode"&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>