Как опустить Чайлдс при выборе элементов в Jquery

Question

У меня есть страница, как этот

 <ul id="carousel_ul" style="left: -130px;" > 

     <li><a href="#">Test 1</a></li> 
     <li> 
      <a href="#">Test 2</a> 

      <div class="subnav"> 
       <ul class="left"> 
        <li><h2>JavaScript</h2></li> 
        <li><a href="#" title="JS Article 1">JS Article 1</a></li> 
        <li><a href="#" title="JS Article 2">JS Article 2</a></li> 
        <li class="last"><a href="#" title="JS Article 3">JS Article 3</a></li> 
       </ul> 
       <ul class="right"> 
        <li><h2>jQuery</h2></li> 
        <li><a href="#" title="jQuery Article 1">jQuery Article 1</a></li> 
        <li><a href="#" title="jQuery Article 2">jQuery Article 2</a></li> 
        <li class="last"><a href="#" title="jQuery Article 3">jQuery Article 3</a></li> 
       </ul> 
      </div> 

     </li> 

     <li><a href="#">Test 3</a></li> 
     <li><a href="#">Test 4</a></li> 
     <li> 
      <a href="#">Test 5</a> 

      <ul class="subnav"> 
       <li class="first"><a href="#" title="The first demo">The first demo</a></li> 
       <li><a href="#" title="Another demo">Another demo</a></li> 
       <li class="last"><a href="#" title="The third demo">The third demo</a></li> 
      </ul> 

     </li> 

     <li><a href="#">Test 6</a></li> 
     <li><a href="#">Test 7</a></li> 
     <li><a href="#">Test 8</a></li> 
     <li><a href="#">Test 9</a></li> 
     <li><a href="#">Test 10</a></li> 
     <li><a href="#">Test 11</a></li> 
     <li><a href="#">Test 12</a></li> 

    </ul> 

</div> <!--end of div id="carousel_inner" --> 

Я выбора элементов, как это

$(document).ready(function(){ 

    $('#carousel_ul li:first').before($('#carousel_ul li:last')); 
    .... 

}); //end of $(document).ready(fn) 

Когда carousel_ul литий делает массив Li то содержат все li и дочерние лики. Как и раньше, я стал <li><a href="#">Test 1</a></li>, <li><a href="#">Test 3</a></li>, <li><a href="#">Test 4</a></li> и так далее. Но когда появляется вторая личность, в нее также входят все дети. Например Test2 li содержит a, div, ul class = left, li, ul class = right, li. Я хочу, чтобы, если у моего li есть подменю типа test2 li и test5 li. Это будет только выбрать его как

<li> 
    <a href="#">Test 2</a> 
</li> 

<li> 
    <a href="#">Test 5</a> 
</li> 

Я хочу сказать, хотя литий test2 и литий test5 имеет подменю в нем, но когда линия $ («# carousel_ul Ли: первый») пробег, то он будет относиться к Li test2 и Li test5 вроде литий test1 или Li test3. Как, если я выбрать Li test2, то я должен получить что-то вроде этого

<li> 
    <a href="#">Test 2</a> 
</li> 

<li> 
    <a href="#">Test 5</a> 
</li> 

вместо

<li> 
    <a href="#">Test 2</a> 

    <div class="subnav"> 
     <ul class="left"> 
      <li><h2>JavaScript</h2></li> 
      .... 
     </ul> 
     <ul class="right"> 
      <li><h2>jQuery</h2></li> 
      .... 
     </ul> 
    </div> 

</li> 

<li> 
    <a href="#">Test 5</a> 

    <ul class="subnav"> 
     <li class="first"><a href="#" title="The first demo">The first demo</a></li> 
     ...  
    </ul> 

</li> 

Как я могу это сделать? Спасибо

Answer 1

Вы можете клонировать нужные предметы, а затем удалять ребенка из клонов.