Как предварительно загрузить изображения с помощью сценария обмена изображениями jquery

Я использую этот скрипт в настоящий момент для обмена изображениями, потому что мне нужно использовать SVG, а затем я использую SVGeezy.

jQuery(function ($) {
    var sourceSwap = function () {
        var $this = $(this);
        var newSource = $this.data('alt-src');
        $this.data('alt-src', $this.attr('src'));
        $this.attr('src', newSource);
    }
    $('img.switch').hover(sourceSwap, sourceSwap);
});

и HTML, который я использую, является

<img class="switch" data-alt-src="<?php bloginfo('template_url'); ?>/img/ost-meetthetribe-rollover.svg" src="<?php bloginfo('template_url'); ?>/img/ost-meetthetribe.svg">

Между двумя разными изображениями существует задержка, так как браузер загружает только изображение опрокидывания, когда пользователь наводил верх.

Поэтому я нашел этот маленький сценарий из другого ответа и придумал этот

jQuery(function ($) {
    var sourceSwap = function () {
        var $this = $(this);
        var newSource = $this.data('alt-src');
        $this.data('alt-src', $this.attr('src'));
        $this.attr('src', newSource);
    }
    $('img.switch').hover(sourceSwap, sourceSwap);
});
// Preload:
function preload(arrayOfImages) {
    $(arrayOfImages).each(function(){
        $('<img/>')[0].src = this;
    });
}
// Usage:
preload([
    'img/ost-whattopack-rollover.svg',
    'img/ost-whattopack-rollover.png',
    'img/ost-whattopack.svg',
    'img/ost-whattopack.png',
    'img/ost-meetthetribe-rollover.svg'
    'img/ost-meetthetribe-rollover.png'
    'img/ost-meetthetribe.svg'
    'img/ost-meetthetribe.png'
]);

Так что это совсем не работает. Есть идеи??