jQuery Image Loader & link

[wolf777]

Saludos tengo una dificultad con parte de mi codigo jquery, es un loader para cargar imagenes, pero deseo agregarles links a esas imagenes y no se como deberia hacerlo.
jQuery:

Código HTML:

            $(function () {
                    var images = new Array();
                            images[0] = 'http://1.jpg';
                            images[1] = 'http://2.jpg';
                            images[2] = 'http://3.jpg';
                    $("ul#portfolio li").each(function(index,el){
                            var img = new Image();
                            $(img).load(function () {
                                $(this).css('display','none'); // since .hide() failed in safari
                                $(el).removeClass('loading').append(this);
                                $(this).fadeIn();
                            }).error(function () {
                                            $(el).remove();
                            }).attr('src', images[index]);
                    });
            });

CSS:

Código HTML:

ul#portfolio {
    margin:0;
    padding:0;
}
ul#portfolio li { 
    float:left;
    margin:0 5px 0 0;
    width:250px;
    height:250px;
    list-style:none;
}
ul#portfolio li.loading { 
    background: url(../images/preload_01.gif) no-repeat center center;
}

pagina principal:

Código HTML:

 <ul id="portfolio">
                    <li class="loading"></li>
                    <li class="loading"></li>
                    <li class="loading"></li>
                    </ul>
                    <div class="clear"></div>