无法实现轮播

这是报错信息：

这是代码：

<script>

    $(()=>{

        console.log('页面元素加载完执行');

        var outerWidth = 600,

            outerHeight = 400,

            speed = 3,

            transitionTime = 0.3,

            initIndex = 0,

            setTimeId = null;

        var $marquee=$('.marquee');

        var $content=$marquee.find('.content');

        var $list=$content.find('.list');

        var listLength = $list.length;//list的长度之和就是content的宽度

        var contentWidth = outerWidth*listLength;//outerWidth就是之前所设置的list的宽度

        var style = document.styleSheets;//获得页面加载的样式表

        $marquee.css({

            "width":`${outerWidth}px`,

            "height":`${outerHeight}px`

        });

        $list.css({//content需要list来算

            "width":`${outerWidth}px`,

            "height":`${outerHeight}px`

        });

        $content.css({//content需要list来算

            "width":`${contentWidth}px`,

            "height":`${outerHeight}px`,

            // "animation":`run ${speed*listLength}s linear infinite`

        });

        var clone = $list.eq(0).clone();//选择list列表里的第一个元素把它克隆下来放到content里面

        $content.append(clone);

        function autoPlay(){

            initIndex++;

            //setTimeId鼠标移动上去就停止轮播

            setTimeId = setInterval(()=>{

                $content.css({

                    "transition":`transform ${transitionTime}s ease`,

                    "transform":`translateX(-${outerWidth*initIndex})`

                })

            },speed*1000)

        }

        autoPlay()

    })

</script>

求指教