为什么我的jQuery悬停功能仅适用于一个图像

Question

我正在尝试创建一个jquery函数来在我将鼠标悬停在图像上时更改图像，它适用于第一个图像但不适用于第二个图像，我不知道为什么。

按钮

  $(document).ready(function(){
  var imgLinkedIn = $('#imgLinkedIn');
  var imgGithub = $('#imgGithub');

  imgLinkedIn.hover(function() {
        $(this).attr("src","images/linkedIn-hover.png");
            }, function() {
        $(this).attr("src","images/linkedIn.png");
    });

  imgGithub.hover(function() {
    $(this).attr("src","images/Octocat-hover.png");
      }, function() {
    $(this).attr("src","images/Octocat.png");
  });
});

HTML

      <a href="https://uk.linkedin.com/pub/ife-a/27/273/745" title="LinkedIn" id="imgLinkedin"  target="_blank">
        <img class="imgContactLogos" id="imgLinkedIn" src="images/linkedIn.png" />
      </a>
      <a href="http://github.com/cinofr3t" title="Github" id="imgGithub" target="_blank">
        <img class="imgContactLogos" id="imgGithub" src="images/Octocat.png"/>
      </a>

Answer 1

首先这样做：

imgLinkedIn = $("#imgLinkedIn");
imgGithub = $("#imgGithub");