I JUST started learning Java / Jquery

I have 3 divs stacked on top of each other that represent 3 thumbnail images. I want then to fade in when the page loads, but I want them to fade in sequentially, starting with the first image on the bottom, up to the top. I.E. the thumbnail following would have a delay so it would fade it one at a time.

I hope I explained myself correctly... here is my shabby code...
Here is the CSS and HTML:
#thumbs1 {
float: left;
height: 100px;
width: 100px;
padding-bottom: 20px;
}
#thumbs2 {
float: left;
height: 100px;
width: 100px;
padding-bottom: 20px;
}
#thumbs3 {
float: left;
height: 100px;
width: 100px;
padding-bottom: 20px;
}

<div id="thumbs_c">
<div id="thumbs1"><img id="Picture1" src="images/50.jpg" width="100" height="100" /></div>
<div id="thumbs2"><img id="Picture1" src="images/50.jpg" width="100" height="100" /></div>
<div id="thumbs3"><img id="Picture1" src="images/50.jpg" width="100" height="100" /></div>
</div>

Here is the JQUERY:

$(function() {
$("#thumbs1").hide();
$("#thumbs2").hide();
$("#thumbs3").hide();
$("#thumbs1").fadeIn(2000, 0.0).fadeIn(2000);
$("#thumbs2").fadeIn(2500, 0.0).fadeIn(2000);
$("#thumbs3").fadeIn(3000, 0.0).fadeIn(2000);
$("a").click(function() {
alert("Hello world!");
});
});

Keep in mind, that the thumbnail will have a different image abviously. Which is why I did it this way, again, obviously because I am brand new and don't know what I am doing.

I would LOVE to hear about the RIGHT way to do it. Really would love some guidance.

Thanks ahead of time!