使用jquery来修改照片的层级

问题遇到的现象和发生背景

想通过修改照片的类名来修改照片显示的层级z-index

问题相关代码，请勿粘贴截图

<script type="text/javascript">
            $(function(){
                // 事件：点击左右按钮，点击下一个按钮下一个层级变高
                // 获取img集合
                var $imgs = $('.imgs img');
                // var $lis = $('.pointers li');
                // 获取左右按钮
                var $leftBut = $('.leftBut');
                var $rightBut = $('.rightBut');
                $leftBut.click(function(){
                    nextPage(false);
                })
                $rightBut.click(function(){
                    nextPage(true);
                })
                // 传入一个形参，来确定是否是下一张
                function nextPage(next){
                    for(var i = 0;i< $imgs.length; i++){
                        // $imgs.index =i;
                        // console.log($imgs.index);
                        // $('.imgs img').removeClass('num1')
                        if(next){
                            $('.imgs img').toggleClass('num1');
                            i++;
                            console.log(i);//1 3 5
                            console.log($imgs[i]);//图片2 图片4
                            // $('.imgs img').toggleClass('num1');
                            // $imgs[i].eq(i).addClass('num1')
                            $('.imgs img')[i].addClass('num1');
                            // $('.imgs img').removeClass('num1');
                        }else{
                            i--;
                        }
                        
                    }
                    
                }
            })
        </script>

运行结果及报错内容

$imgs[i].addClass is not a function；

我的解答思路和尝试过的方法

我想通过 $imgs.each()方法来遍历 $imgs集合，将当前索引赋值给当前显示的图片，但是不能成功赋值
通过修改 $imgs[i].css('zIndex','2');来修改层级，报错 $imgs[i].css('zIndex','2')is not a function；
以及上述解决办法。

我想要达到的结果

想通过修改照片的类名来修改照片显示的层级z-index，点击下一张，可以将下一张图片的层级提高

用eq试下
$('.imgs img').eq(i).addClass('num1')