title: How to add a class to the next element of current element array in jquery?
body: <p>I would like to know how to do such thing.</p>
  
  <p>e.g. I have something like this:</p>
  
  <pre><code>&lt;ul&gt;
     &lt;li&gt;&lt;a href="1.html"&gt;first item&lt;/a&gt;&lt;/li&gt;
     &lt;li&gt;&lt;a href="2.html"&gt;second item&lt;/a&gt;&lt;/li&gt;
     &lt;li&gt;&lt;a href="3.html"&gt;third item&lt;/a&gt;&lt;/li&gt;
     &lt;li&gt;&lt;a href="4.html"&gt;fourth item&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>I need to addClass to a hover a element, this is easy I do it like this:</p>
  
  <pre><code>$("li a").hover(
      function () {
          $(this).addClass("show");
      },
      function () {
          $(this).removeClass("show");
      }
  );
  </code></pre>
  
  <p>However, I need to addClass to every next li element also. </p>
  
  <p>So, when e.g. first <strong>li a</strong> eleemnt is hovering the class show2 will be added to <strong>li a</strong> of the second li a element.</p>
  
  <p>How to do this?</p>