1、首先看下我们的代码，html代码里定义了几个checkbox选项，另外还引入了Jquery脚本，我们的js代码里为了方便，使用Jquery来操作。
2、页面运行后，如图，默认下，checkbox选项选中后，是不会改变颜色的。
3、需要为选中项添加不一样的颜色，我们要添加一些JS代码，如图，我们的JS代码的大概意思是，为每个checkbox选项添加点击事件，当c茑霁酌绡heckbox选中的时候，为该checkbox所在的div添加一个class样式，该样式定义文字颜色为紫色。
4、再次运行页面，当我们点击checkbox选项，选中该选项时，该checkbox的文字颜色就变为紫色了。所以我们能用js让选项变色了。除了可以改变文字颜色，我们还可以添加背景颜色，只要在checked样式里定义所需要的样式就行了。
5、但该代码还没完善，还有一点问题，当再次点击checkbox选项，取消选中状态时，该文字的颜色还是紫色。如图
6、再修改下代码，为代码添加一些逻辑，如图，当我们在点击checkbox选项时，如果是取消选项选中状态的，我们则为其父容器，即div去掉checked的样式。去掉这个样式class后，该选项的文字就不会是紫色了。
7、刷新页面，看下效果，现在选中checkbox选项，文字会变色，取消选中，则会恢复原来的颜色了。
