用jquery操作html，向<ul><li></li><li></li></ul>的第一li后面追加</ul><ul>的问题
<head runat="server">
<title></title>
<script src="js/jquery-1.6.2.js" type="text/javascript"></script>
<style type="text/css">
.subitem{ margin: 5px 0;width: 500px;float: left;border-right: #ddd 1px dotted; min-height:400px; }
.subitem ul{ width: 490px; margin: 0 0 0 10px; list-style: none; }
.subitem li{ width: 240px; line-height: 14px;overflow: hidden; }
</style>
<script type="text/javascript">
function OK() {
$("#my_sp").after("</ul><ul>");
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="button" onclick="OK()" value="点吧" />
<div class="subitem">
<ul>
<li><a>烷烃及衍生物</a></li>
<li><a>烷烃及衍生物</a></li>
<li><a>烷烃及衍生物</a></li>
<li id="my_sp">
<a>看我后面是否被</ul><ul>分割开</a>
</li>
//注：我想在这个位置 追加 </ul><ul> ,这样前面的</ul>与上面的配对，后面的<ul>后下面的</ul>配对
<li><a>烷烃及衍生物</a></li>
<li><a>烷烃及衍生物</a></li>
<li><a>烷烃及衍生物</a></li>
</ul>
</div>
</div>
</form>
</body>
问题是：浏览器好像自动将</ul><ul>解析配对，弄成了<ul></ul>,这样就反了，达不到效果?
我想之后变成这样：
<ul>
<li><a>烷烃及衍生物</a></li>
<li><a>烷烃及衍生物</a></li>
<li><a>烷烃及衍生物</a></li>
<li id="my_sp">
<a>看我后面是否被</ul><ul>分割开</a>
</li>
</ul><ul>
<li><a>烷烃及衍生物</a></li>
<li><a>烷烃及衍生物</a></li>
<li><a>烷烃及衍生物</a></li>
</ul>
[解决办法]
function OK() {
$(".subitem").html($(".subitem").html().replace(/(<li.*?id="my_sp"[\s\S]*?<\/li>)/g,"$1</ul><ul>"));
}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
#select {
border: 1px solid red;
}
#select li {
background-color: #2aa;
padding: 20px;
}
</style>
</head>
<body>
<div class="subitem" id='cc'>
<ul>
<li><a>烷烃及衍生物</a></li>
<li><a>烷烃及衍生物</a></li>
<li><a>烷烃及衍生物</a></li>
<li id="my_sp">
<a>看我后面是否被</ul><ul>分割开</a>
</li>
<li><a>烷烃及衍生物</a></li>
<li><a>烷烃及衍生物</a></li>
<li><a>烷烃及衍生物</a></li>
</ul>
</div>
<script>
function youWant(){
//var subitem0 = document.getElementById("cc");
var subitem0 = document.getElementsByClassName("subitem")[0];
var html = subitem0.innerHTML;
var newhtml = html.replace(/(<li.*?id="my_sp"[\d\D]*?<\/li>)/g,"$1</ul><ul>");
subitem0.innerHTML = newhtml;
}
youWant();
</script>
</body>
</html>
