title: On button click how to change focus
body: <p>I have a html page with n numbers of anchor tags throught the body and a button tag</p>
  
  <pre><code>&lt;input type="button" value="Next" id="btn1"&gt;
  &lt;a id="abc1" href=""&gt;&lt;mark style="background:red"&gt;john&lt;/mark&gt;&lt;/a&gt; is brilliant human.....  &lt;br&gt;
  &lt;a id="abc1" href=""&gt;&lt;mark style="background:red"&gt;john&lt;/mark&gt;&lt;/a&gt; is brilliant human.....&lt;br&gt;
  &lt;a id="abc1" href=""&gt;&lt;mark style="background:red"&gt;john&lt;/mark&gt;&lt;/a&gt; is brilliant human.....&lt;br&gt;
  &lt;a id="abc1" href=""&gt;&lt;mark style="background:red"&gt;john&lt;/mark&gt;&lt;/a&gt; is brilliant human.....&lt;br&gt;
  &lt;a id="abc1" href=""&gt;&lt;mark style="background:red"&gt;john&lt;/mark&gt;&lt;/a&gt; is brilliant human.....&lt;br&gt;
  </code></pre>
  
  <p>The id attribute of all anchor tags is same
  Now i just want that when clicking on button the focus on anchor tags should get change one by one
  for this i have tried this jquery code but the focus is not changing from first tag</p>
  
  <pre><code>$("#btn1").on("click", function () {
      $(this).next("#abc1").focus();
   });
  </code></pre>
  
  <p>if possible the solution would need to be based using Javascript and not something like JQuery.</p>
  
  <p>Any help greatly appreciated</p>