Jquery disjointed image swap

Hi All, i have just made a simple disjointed image swap in jquery (hover over image and larger image swaps to the image you are hovering over), if its any use to anyone code below

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#thumb a").mouseover(function() {
   var x=$("img", this).attr("src");
$("#image").attr("src", x);
 })
});
</script>
<style type="text/css">
ul {
margin: 0;
padding: 0;
}
#image {
margin-bottom: 10px;
}
#thumb li {
display:inline;
list-style-type: none;
margin-right: 10px;
}
img {
border: none;
}
</style>
<img src="images/sample4.jpg" width="179" height="179" id="image" alt="image">
<ul id="thumb">
 <li><a href="#"><img src="images/sample1.jpg" width="79" height="78" id="i1" alt="image" /></a></li>
 <li><a href="#"><img src="images/sample2.jpg" width="79" height="78" id="i2" alt="image" /></a></li>
 <li><a href="#"><img src="images/sample3.jpg" width="79" height="78" id="i3" alt="image"></a></li>
 <li><a href="#"><img src="images/sample4.jpg" width="79" height="78" id="i4" alt="image"></a></li>
</ul>