实例见锐意先行《手机test》中《手机test5》。

针对a写两段样式：

.nav_ul > li > a {
    display: block;
    background: url(‘images/down.png‘) no-repeat scroll right center transparent;
    padding: 10px 0px;
    border-bottom: 1px solid #E2E2E2;
    color: #000;
    font-size: 1.5em;
    transition: all 0.4s ease 0s;
}

/*点击前的color是#000;*/
.nav_ul > li > a.color{
    color: #E60012;
}

/*点击后的color是#E60012;*/

JS代码：

<script type="text/javascript">

$(document).ready(function(){
    $(‘#js_nav_ul li a‘).click(function(){
        $(‘#js_nav_ul li > a‘).removeClass(‘color‘);
        $(this).addClass(‘color‘);
    });
});
</script>

//removeClass() 方法从被选元素移除一个或多个类。

addClass() 方法向被选元素添加一个或多个类。

该方法不会移除已存在的 class 属性，仅仅添加一个或多个 class 属性。

提示：如需添加多个类，请使用空格分隔类名。

代码先写removeClass() ，去掉原先的样式color: #000;

后写addClass()，追加新样式 color: #E60012;。

【技术】点击后变色（jQuery的removeClass和addClass）