Javascript 无法使addClass和removeClass正常工作，从而创建；15游戏“；

我正试图用html中的jquery编写“15游戏”。游戏将得到一张1-15的“盒子”表

我的代码：

//插入从1到arraysize的数字
函数插入元素（myArr、arraysize）{
对于（变量i=1；imyArr.length）| |（indexA<0）| |（indexB>myArr.length）| |（indexB<0））{
警惕（“出界”）；
} 
否则{
var temp=myArr[indexA]；
myArr[indexA]=myArr[indexB]；
myArr[indexB]=温度；
}
}  
//等待页面完成加载
$（文档）.ready（函数（）{
//创建数组
var myArr=[]；
var arraysize=17；
var lastelement=arraysize-1；
var空_行；
var empty_col；
var空_细胞；
var-col；
var行；
var非空单元；
//插入元素
插入元件（myArr，arraysize）；
//洗牌次数
var-shuffleNum=10000；
//洗牌
对于（var i=0；i

第15场比赛
.主集装箱
{
宽度：35%；
边框：10px纯黑；
}
.主货柜运输署
{
宽度：100px；
高度：100px；
文本对齐：居中；
字体大小：100px；
边框：3倍纯黑；
}
.非空
{
背景色：红色；
}
.空的
{
背景色：#C0；
}
.非空：悬停
{
边框：3倍纯白；
}
这里的问题是jQuery行：

$(".empty").click(function(){
    alert("Clicked empty cell!");
});

请参阅，该行将所有元素与“.empty”匹配，并将单击事件处理程序添加到它们中。在一个元素上更改类时，不会重置事件处理程序

您需要的是更大范围内的事件处理程序，例如表或文档。然后检查事件目标是否具有该类。
您正在将事件绑定到元素的初始类。以后更改类不会更改事件绑定

您可以改为使用委派事件，这样它们在事件发生时会检测到类：

$(".maincontainer").on("click", ".nonempty", function(){

及

演示：


//插入从1到arraysize的数字
函数插入元素（myArr、arraysize）{
对于（变量i=1；imyArr.length）| |（indexA<0）| |（indexB>myArr.length）| |（indexB<0））{
警惕（“出界”）；
} 
否则{
var temp=myArr[indexA]；
myArr[indexA]=myArr[indexB]；
myArr[indexB]=温度；
}
}  
//等待页面完成加载
$（文档）.ready（函数（）{
//创建数组
var myArr=[]；
var arraysize=17；
var lastelement=arraysize-1；
var空_行；
var empty_col；
var空_细胞；
var-col；
var行；
var非空单元；
//插入元素
插入元件（myArr，arraysize）；
//洗牌次数
var-shuffleNum=10000；
//洗牌
对于（var i=0；i$(".maincontainer").on("click", ".empty", function(){