Почему не работают стрелки slick slider'a вставенные через object?

Поменял slick'у стрелки на svg'стрелки таким образом.

$(document).ready(function(){
  $('.head-slider__slider').slick({
    dots: true,
    infinite: true,
    speed: 1000,
    prevArrow: '<object data="img/angle-left.svg" class="slick-prev" type="image/svg+xml"></object>',
    nextArrow: '<object data="img/angle-left.svg" class="slick-next" type="image/svg+xml"></object>',
  });
});

Проблема в том, что теперь при нажатии на эти кнопки слайдер не крутиться, думал, что это может быть связано с тем, что при такой замене - потерялись классы к которым было привязано событие, для этого добавил те же классы что были и у деффолтных стрелок. .slick-prev .slick-next, но это не помогло. В чем может быть проблема?

Demo: https://uzinouzi.github.io/testtemplate/