title: Triggering :hover on second element when hovering on first
body: <p>I've got this test page going on: <a href="http://joshuacody.net/qworky/" rel="nofollow noreferrer">http://joshuacody.net/qworky/</a></p>
  
  <p><strong>Warning:</strong> Tons of CSS3. This will only look right in Safari or Chrome. Firefox will be tolerable. All else will be lost.</p>
  
  <p>Essentially, when I hover on someone's name, I'd like it to trigger the hover state on their image as well. It's working now, but I feel the solution is inelegant. I'd rather not add more classes. Here it is:</p>
  
  <pre><code>$('a.name_link').hover(function(){
      $(this).parent('p').siblings('img').toggleClass('link_hover');
  });
  
  $('img.name_img').hover(function(){
      $(this).siblings('p').children('a').toggleClass('hover');
  });
  </code></pre>
  
  <p>I thought the following would work:</p>
  
  <pre><code>$('a.name_link').hover(function(){
      $(this).parent('p').siblings('img').trigger('hover');
  });
  </code></pre>
  
  <p>Any idea why it's not? I'm really looking for the cleanest, simplest way to do this. Thanks so much!</p>