Почему-то я не могу использовать гладкую карусель (http://kenwheeler.github.io/slick/) правильно.

Я получаю следующую ошибку:

Uncaught TypeError: $(...).slick is not a function

Я запускаю следующий код в моем файле JavaScript:

function initSlider(){
    $('.references').slick({
        dots: false,
        infinite: true,
        speed: 300,
        slidesToShow: 1,
        autoplay: true,
        prevArrow: '<div class="slick-prev"><i class="fa fa-chevron-left"></i></div>',
        nextArrow: '<div class="slick-next"><i class="fa fa-chevron-right"></i></div>'
    });
}

Я включил последнюю версию jQuery (2.1.4) с бауэром. Я также пытался включить jQuery CDN в заголовок моего файла шаблона макета, но это тоже ничего не решило.

Единственная странная вещь, которая может что-то значить, это то, что когда я не использую функцию для вызова слайдера, она работает, но выдает ошибку:

Uncaught TypeError: Cannot read property 'add' of null

Я обнаружил, что это означает, что код был загружен до загрузки DOM, что является правильным (я думаю).

Заранее спасибо!

Изменить: я создал JSFiddle из моего кода:https://jsfiddle.net/brz30e77/

РЕДАКТИРОВАТЬ 2: ошибка постоянно возникала при добавлении новой функции в мой файл JS. В конце концов я удалил свой сцепленный файл JS и обнаружил, что загружаются две версии jQuery, одна из которых была очень, очень старой.