使用jQuery为随机按钮添加类时.toggleClass()报错，原生JS可正常运行

问题根源 #

$('.btn')获取的是jQuery对象集合，通过button[randomNumber]访问时得到的是原生DOM元素，而原生DOM元素并没有jQuery的.toggleClass()方法，因此触发报错。原生JS的classList.add()是DOM元素自带方法，所以能正常运行。

解决办法 #

有三种可行修复方式：

1. 用jQuery的.eq()方法获取指定索引的jQuery对象
   .eq()会返回对应位置的jQuery包装对象，可直接调用.toggleClass()：

const startGame = () => {
    console.log(button);
    console.log(randomNumber);
    button.eq(randomNumber).toggleClass("pressed");
}

2. 将原生DOM元素重新包装为jQuery对象
   把下标获取到的原生元素用$()包裹，转化为jQuery对象后调用方法：

const startGame = () => {
    console.log(button);
    console.log(randomNumber);
    $(button[randomNumber]).toggleClass("pressed");
}

3. 直接使用原生JS的.classList.toggle()方法
   既然原生方法可用，也可以直接用原生API切换类：

const startGame = () => {
    console.log(button);
    console.log(randomNumber);
    button[randomNumber].classList.toggle("pressed");
}

内容的提问来源于stack exchange，提问作者Teodor Yonev