javascript – 使用jquery单击后更改另一个图像

我有一个图像作为切换动画(button.png)的按钮,我希望该图像在单击它以获得另一个图像(button2.png)后更改,并且一旦您单击第二个图像,它将再次更改为第一张图片,我有：

<script type="text/javascript">
$(document).ready(function() {

  // when click on the tag with id="btn"
  $('#btn').click(function() {
      // change the state of the "#idd"
    $('#idd').toggle(800,function() {
      // change the button text according to the state of the "#idd" 
      if ($('#idd').is(':visible')) {
        $('#btn').attr('images/button2.png',this.href); // Show Less.. button
              } else {
        $('#btn').attr('images/button.png',this.href); //Learn More.. button

      }
    });
  });
});
</script>

和我的Html：

<div id="idd" style="display:none;">

- Here my hidden content -

</div>

<!-- Button -->
<img src="images/button.png" style="cursor: pointer;" id="btn">

我做错了什么？请帮忙 ：(