1つのdivに一連のliをラップする方法は？

Question

私は、次のHTMLコードを持っている：これを行う方法を

<ul> 
<div id="list1"> 
    <li id="a1">content</li> 
    <li id="a2">content</li> 
    <li id="a3">content</li> 
    <li id="a4">content</li> 
    <li id="a5">content</li> 
</div> 
<div id="list2"> 
    <li id="a6">content</li> 
    <li id="a7">content</li> 
</div> 
</ul> 

任意のアイデア：

<ul> 
<li id="a1">content</li> 
<li id="a2">content</li> 
<li id="a3">content</li> 
<li id="a4">content</li> 
<li id="a5">content</li> 
<li id="a6">content</li> 
<li id="a7">content</li> 
</ul> 

私は1つのdivの中にこれらのliタグをラップするためにjqueryのを使用したい、と同じ？

ありがとうございました！

EDIT：私の質問を明確にするために申し訳ありません：1つのulに一連のliタグがあります.1つのdivにそれらの一部をラップしたいとします（たとえば、a1をa5のa5 1つの部門のa7に）。私が確かに知っているのは、私がラップしたいliタグがそのIDとして連続する数字を持つということです。

EDIT2：ul内にdivを持つことは有効ではないことに気付きました。私がこの質問をしているのは、jquery UIを使ってulを2つのタブに分割することです.1つはli a1からa5、もう一方はタブでa6とa7です。私はhtmlコードを変更することができないので、jqueryを使用してこれを行う方法を知りたがっています

Answer 1

あなたのコメントによると、これらの7つのタブを2つのタブに分割し、それぞれにサブタブを付けるとします。あなたはjQueryのUIタブを使用していると言っています。 $('#tabs').tabs()を実行すると、2-タブ付きレイアウトにこれを変換します

<div id="tabs"> 
    <!-- These are the tabs --> 
    <ul> 
    <li><a href="#tab-A">Tab A</a></li> 
    <li><a href="#tab-B">Tab B</a></li> 
    </ul> 
    <!-- This is your tab content --> 
    <div id="tab-A"> 
    This is tab A 
    </div> 
    <div id="tab-B"> 
    This is tab B 
    </div> 
</div> 

：

のjQuery UIのタブは、次のレイアウトを使用しています。あなたは、このように見えるようにあなたのHTMLを変換する必要があり、それは動作します。そして、各タブの内側に、インナータブを追加する別のUL/div設定があります。 http://jsfiddle.net/cCjbC/1/は

それは2つの外側のタブを作り、そして、あなたのULを取り、それを分割して、内側のタブとしてそれらを追加します。ここでは

はあなたがやりたいことができる方法です。

Answer 2

私はここで何を求めているのかよく分かりませんが、ULタグを追加してDIV

<div id="list"> 
<ul> 
<li id="a1">content</li> 
<li id="a2">content</li> 
<li id="a3">content</li> 
<li id="a4">content</li> 
<li id="a5">content</li> 
</ul> 
</div> 

Answer 3

を実行し、次のコード：

$("ul") 
    .prop("id","list1") 
    .after("<ul id='list2'/>"); 

$("#a6") 
    .nextAll() 
    .andSelf() 
    .appendTo("#list2"); 

そしてそれはそうのようなあなたの単一<ul><ul> 2に年代になります：

<ul id="list1"> 
    <li id="a1">content</li> 
    <li id="a2">content</li> 
    <li id="a3">content</li> 
    <li id="a4">content</li> 
    <li id="a5">content</li> 
</ul> 
<ul id="list2"> 
    <li id="a6">content</li> 
    <li id="a7">content</li> 
</ul>