How to change image with onclick?

To change the image using OnClick function i have found 2 ways.

1. Using jQuery.
2. Normal JavaScript.

Lets look one by one.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  <script type="text/javascript">
 $(document).ready(function(){
   $("#ChangeImage").click(function(){
    $('#ChangeImage').attr('src','yahoo.gif');
   });
 }); 
</script>
 <img src="bm_yahoo.gif" name="my_pic" id="ChangeImage">  

====

<script type="text/javascript">
  function changePic()
  {  
 document.getElementById("Img1").src="bm_yahoo.gif";
 }
 </script>
  <a href="#" onclick="changePic()";>
<img border="0" id="Img1" src="yahoo.gif" /></a> 
</script>