javascript - 画像をDOMに動的に挿入するには?

Question

動的に div を作成し、それに画像オブジェクトを追加して画像をプリロードしようとしていますが、残念ながら div は作成されていますが、画像が添付されていません。コードは次のとおりです。

var preLoadImages = function(im) {
    var args_len = im.length;
    var slides = $('.slides');
    for (var i = args_len; i--;) {
        var img = $('<img>', {
            src : 'img/' + im[i] + '.jpg',
            alt : kp.imgAlt[i]
        })
      img.load(function(){
        (function(index){ 
            kp.cache.push(img);
            var toAppend = $('<div class="slide"></div>')
                            .css({'z-index' : (args_len - index) + 'px'})
                            .append(kp.cache[index]);
            slides.append(toAppend);
            kp.setTimer();
            kp.startSlideshow();
            if(i == 0){
                $('.slides #cover').fadeOut(800, function(){
                    $(this).remove();
                });
            }
        })(i);
      });

    }
  };

私は何を間違っていますか？Firebug でページをデバッグしていると、画像が適切に作成され、kp.cache変数に存在することがわかります。