how to fadeIn an image using <img> tag instead of a <div> using jQuery?

I'm trying out some jQuery for the first time. My first goal is for one image on the page to fade into a different image. I've figured out how to do this with a couple of divs that have background-image set to the different image files (see code below). However, this would work better for my situation if I was somehow doing this to an existing img tag instead of using some divs. Is there any way to do what this code does, but with the img tag?

<html>
  <head>
    <script type="text/javascript" src="jquery-1.6.4.js"></script>
    <script type="text/javascript">
      $(function() {
          $("#imgblock2").delay(3000).fadeIn(3000);
      });

    </script>
    <style type="text/css">
      #imgblock {
        background-image:url("frame.jpg");
        width:240;
        height:320;
        position:absolute;
        top:0;
        left:0;
      }
      #imgblock2 {
        background-image:url("average.jpg");
        width:240;
        height:320;
        position:absolute;
        top:0;
        left:0;
        display:none;
      }
    </style>

  </head>
  <body>
    <div id="imgblock"></div>
    <div id="imgblock2"></div>
  </body>
</html>

Solution

Yes, Use actual images instead of divs. you an give the images id's as well.