jquery fade images from array over initial image?

[gorilla1]

I am trying to use jquery to overlay a first loaded image with others that are not present in the html (I cannot change the html on the page). I have seen many jquery slideshows, but they all seem to rely on the images being already in the document, usually set to hidden.

I would like to use a function like the following (developed by Jon Raasch):

$(document).ready( function() {
  // Every six seconds execute the switchSlide() function
  setInterval( "switchSlide()", 6000);
});

// This function takes the first .slide element and put at the end
function switchSlide() {
  var slide = $('.slideshow .slide:first');
  slide.hide();
  $('.slideshow').append(slide);
  slide.fadeIn('slow');
}
which is based on a div styled like so:
<style>
.slideshow {
  height: 220px;
  width: 350px;
  margin: 0;
  position: relative;
}

.slideshow .slide {
  position: absolute;
}

but I cannot change the html (which is shown below), so I need to preload the images that will fade in over the first and then somehow get some slideshow code to work from the array of loaded images

<div class="image_wrap">
                  <a id="my_image" href="#">
                     	           
                     		   <img src="my.jpg" title=""
                          alt="" />

                     	   </a>
                  
               </div>

Here is code for preloading images, but, again, how to bring them into the slideshow using jquery?

$(window).bind('load', function(){
   var preload = [
	'cov1.jpg',
	'cov2.jpg',
	'cov3.jpg'];           
   $(document.createElement('img')).bind('load', function(){
    if(preload[0]) this.src = preload.shift();
   }).trigger('load');

G