这个小特效代码很简单，就不多做说明了，直接奉上源码。

JQuery代码：

复制代码 代码如下:

<script type="text/javascript">

//加载事件

$(function () {

var collection = $(".flag");

$.each(collection, function () {

$(this).addClass("start");

});

});

//单击事件

function dj(dom) {

var collection = $(".flag");

$.each(collection, function () {

$(this).removeClass("end");

$(this).addClass("start");

});

$(dom).removeClass("start");

$(dom).addClass("end");

}

</script>

Css代码：

复制代码 代码如下:

<style type="text/css">

.start

{

cursor:pointer;

color:Green;

}

.end

{

cursor:pointer;

color:Red;

}

</style>

Html代码：

复制代码 代码如下:

<span>LoveOne</span>

<span>LoveTwo</span>

<span>LoveThree</span>

<span>LoveFour</span>

是不是很简单，特效也很好玩，小伙伴们可以自由发挥下，可扩展性还是很强的，如果做出来其他更好玩的，还请告诉我。