Scrolling Window Issue

Scrolling Window Issue

Perhaps someone can help me out. Currently I'm working on a web interface where the user clicks an image and more information about our promotion is shown in a div below. Thus far, it is working well, but when the user clicks on the image, the browser window scrolls to the top of the page. The code itself has to be cleaned up a bit, but this is what it looks like thus far. I already tried using evt.preventDefault(). If anyone can help me out, I'd be most appreciative.

    $(document).ready(function() {   
                $('#promos').hide();
                $('#dock').show();
                $('.promo').each(function(){
                    var $this = $(this);
                    var $buttonImg = $this.children('img');
                    var $imgSrc = $buttonImg.attr('src');
                    var $Dockhtml = '<img class="dockbutton" src="' + $imgSrc + '"/>';
                    $('#dock').append($Dockhtml);
                }); //end each
               
                var $winHtml = $('#redcard').html();
                $('#window').empty().hide().append('<div class="promo" id="#redcard">' + $winHtml + '</div>');
                $('.promoText').css('margin-left', '300px');               
                $('#window').fadeIn(500);
               
                $('#dock').children('img').click(function(evt) {
                    $(this).blur();
                    var $imgSrc = $(this).attr('src');
                    var $imgSrcStart = $imgSrc.lastIndexOf('/');
                    var $imgSrcEnd = $imgSrc.indexOf('.', $imgSrcStart + 1);
                    var $id = '#' + $imgSrc.substring($imgSrcStart + 1, $imgSrcEnd);
                    $winHtml = $($id).html();
                    $('#window').empty().hide().append('<div class="promo" id="' + $id + '">' + $winHtml + '</div>');
                    $('.promoText').css('margin-left', '300px');
                    $('#window').fadeIn();
                }); // end click
            }); // end ready