title: jQuery - Get next element, regardless of DOM placing
body: <p>I currently have the the following HTML structure:</p>
  
  <pre><code>&lt;div class="article-preview"&gt;
      &lt;h1&gt;&lt;a href=""&gt;Title&lt;/a&gt;&lt;/h1&gt;
      &lt;a class="pic-link" title="" href=""&gt;&lt;img src="" /&gt;&lt;/a&gt;
  &lt;div/&gt;
  </code></pre>
  
  <p>When the image link or the heading link is hovered, I want to change the color/border-color of both.</p>
  
  <p>I tried to use the <code>next()</code> filter:</p>
  
  <pre><code>$('.article-preview h1 a').mouseover(function(){
      $(this).animate({
          color: "#94c4c1"
      }, 10); 
      $(this).next('img').animate({
          borderTopColor: '#94c4c1',
          borderRightColor: '#94c4c1',
          borderBottomColor: '#94c4c1',
          borderLeftColor: '#94c4c1'
      }, 200);
  });
  $('.article-preview h1 a').mouseout(function(){
      $(this).animate({
          color: "#000000"
      }, 200);
      $(this).next('img').animate({
          borderTopColor: 'white',
          borderRightColor: 'white',
          borderBottomColor: 'white',
          borderLeftColor: 'white'
      }, 200);
  
  });
  $('.article-preview a img').mouseover(function(){
      $(this).animate({
          color: "#94c4c1"
      }, 10); 
      $(this).parent().find('a:first').animate({
          borderTopColor: '#94c4c1',
          borderRightColor: '#94c4c1',
          borderBottomColor: '#94c4c1',
          borderLeftColor: '#94c4c1'
      }, 200);
  });
  $('.article-preview h1 a').mouseout(function(){
      $(this).animate({
          color: "#000000"
      }, 200);
      $(this).parent().find('a:first').animate({
          borderTopColor: 'white',
          borderRightColor: 'white',
          borderBottomColor: 'white',
          borderLeftColor: 'white'
      }, 200);
  
  });
  </code></pre>
  
  <p>This doesn't work, because <code>next</code> only looks in the until the end of the heading. Is there a way to search for the next img element (from the selected element, in this case the <code>&lt;a&gt;</code> Tag), regardless of the placing in the DOM?</p>