Javascript 如何在单击时分别设置每个元素的动画？

我当前的代码为类“.movinglinecontainer”的所有实例设置动画。我希望我的代码只针对单击的实例运行

我尝试实现$（这个），但似乎无法使它正常工作

函数ani（）{
var loadingbar=jQuery（'.movinglinecontainer'）；
if（loadingbar.hasClass（'movingline'））{
loadingbar.removeClass（'movingline'）.addClass（'movinglinereverse'）；
}else if（loadingbar.hasClass（'movinglinereverse'））{
loadingbar.removeClass（'movinglinereverse'）.addClass（'movingline'）；
}否则{
loadingbar.addClass（'movingline'）；
}
};
jQuery（文档）.ready（函数（）{
jQuery（'.movinglinecontainer'）。打开（“单击”，函数（）{
ani（）；
});
});

常见问题
问题就在这里？
答案在这里
问题2在这里？
答案2在这里
您可以尝试将
$（this）
作为参数传递给函数：


功能ani（加载条）{
if（加载条）{
if（loadingbar.hasClass（'movingline'））{
loadingbar.removeClass（'movingline'）.addClass（'movinglinereverse'）；
}else if（loadingbar.hasClass（'movinglinereverse'））{
loadingbar.removeClass（'movinglinereverse'）.addClass（'movingline'）；
}否则{
loadingbar.addClass（'movingline'）；
}
}
};
jQuery（文档）.ready（函数（）{
jQuery（'.movinglinecontainer'）。打开（“单击”，函数（）{
ani（$（本））；
});
});
.movinglinecontainer{
高度：20px；
过渡：宽度3s线性；
背景：水；
宽度：30%
}
.移动线路{
宽度：100%
}
.movinglinereverse{
宽度：30%
}

常见问题
问题就在这里？
答案在这里
问题2在这里？
答案2在这里
谢谢您的建议。我尝试了您编辑的脚本，但现在在控制台中出现以下错误：未捕获引用错误：在htmldevelment.onclick（（索引）：473）@BrianBeahan尝试在ready上定义
ani
函数