jquery是一种高效且常用的javascript库，主要用于简化html文档的遍历和操作、事件处理、动画效果的实现，前端开发者经常使用它来开发交互性强的网页。在jquery中添加和删除样式也是一项常见的任务，下面将介绍如何使用jquery实现点击添加和删除样式。
首先，我们需要使用HTML和CSS创建一个简单的样式列表。在HTML中，我们可以使用ul和li标签创建一个简单的无序列表，代码如下：
- Item 1
- Item 2
- Item 3
- Item 4
接着，在CSS中，我们可以为列表项指定样式，以便在添加和删除样式时使用。代码如下：
.myList li{
padding:10px;
border:1px solid black;
cursor:pointer;
}
.myList li.selected{
background-color:gray;
color:white;
}现在，在JavaScript文件中，我们可以使用jQuery来实现添加和删除样式。首先，我们需要使用jQuery选择器找到所有列表项，并使用click()函数向它们添加单击事件，代码如下：
$(document).ready(function(){
$('.myList li').click(function(){
//代码将在此处添加
});
});在单击事件中，我们可以使用toggleClass()函数来添加或删除.selected类，即已经在CSS中定义了的样式。代码如下：
$(document).ready(function(){
$('.myList li').click(function(){
$(this).toggleClass('selected');
});
});现在，当单击列表项时，它们将切换被选中状态的样式。如果已经被选中，则将其取消选择，反之亦然。可以在线采用此示例：https://codepen.io/alenaofficial/pen/zYGOYap
添加和删除样式就是这么简单，使用jQuery，我们可以轻松地实现动态样式变化，从而提升用户体验。
