该代码实现点击图片放大显示详细内容 ，但是显示不出来

该代码实现点击图片放大显示详细内容 ，但是显示不出来 ，检验再三 实在看不出问题在哪，求高人指点<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title></title>
    <script type="text/javascript" src="js/jquery-1.4.2.js"></script>
    <script type="text/javascript">
        var data = { "images/1small.JPG": ["images/1.JPG", "第一个", "10"], "images/2small.JPG": ["images/2.JPG", "第二个", "20"], "images/3small.JPG": ["images/3.JPG", "第三个", "30"] };
        $(function() {
            $.each(data, function(key, value) {
                var smallimg = $("<img src='" + key + "'/>");
                smallimg.attr("bigmappath", value[0]);
                smallimg.attr("whichone", value[1]);
                smallimg.attr("ages", value[2]);                smallimg.mouseover(function(e) {
                    $("#img1").attr("src", $(this).attr("bigmappath"));
                    $("#whichone").text($(this).attr("whichone"));
                    $("#ages").text($(this).attr("ages"));
                    $("#div1").css("left", e.pageX).css("top", e.pageY);
                })                $("body").append(smallimg);            });
        })
    </script>
</head>
<body>
       <div id="div1" style="position:absolute; display:none;">
        <img id="img1" src="" alt="" />
        <p id="whichone"></p>
        <p id="ages"></p>
    </div>
</body>
</html>