<!DOCTYPE html PUBLIC
"
-//W3C//DTD XHTML 1.0 Transitional//EN
"
"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
"
>
<html xmlns=
"
http://www.w3.org/1999/xhtml
"
>
<head>
<title></title>
<script src=
"
Scripts/jquery-1.4.1.js
"
type=
"
text/javascript
"
></script>
<script type=
"
text/javascript
"
>
$(function () {
$(
"
#ul1 li
"
).css(
"
cursor
"
,
"
pointer
"
).mouseover(function () {
$(
this
).css(
"
background
"
,
"
red
"
).siblings().css(
"
background
"
,
"
white
"
);
//
把自己背景色设为红色兄弟节点设为白色
}).click(function () { $(
this
).css(
"
background
"
,
"
white
"
).appendTo(
"
#ul2
"
) })
//
点击后添加到第二个ul中
});
</script>
</head>
<body>
<ul id=
"
ul1
"
style=
"
float: left; width: 30%
"
>
<li>国足</li>
<li>朝鲜队</li>
<li>美国队</li>
<li>韩国队</li>
<li>巴西队</li>
<li>越南队</li>
<li>伊拉克队</li>
</ul>
<ul id=
"
ul2
"
style=
"
float: left; width: 30%
"
>
</ul>
</body>
</html>