liを最後のオブジェクトとして追加する方法は？

Question

私は現在、私はそれがこのように見える必要があります（*注コード

<div id="news-articles"> 
 
    <ul class="display-posts-listing"> 
 
    <li class="listing-item"> 
 
     <span></span> 
 
     <span class="category-display"></span> 
 
     <span></span> 
 
     <span></span> 
 
    </li> 
 
    </ul> 
 
</div>

のこのライン持っている - 複数のULSがありますので、それはそれぞれ「span.category表示にする必要があります。 「ザッツ）は、自分の親李内の最後の付加されます：

//Ive been trying to use this js script, but so far no results. Can anyone assist? Thanks so much! : 
 

 

 

 

 

 
    $("#news-articles .category-display").each(function() { 
 
       $(this).prev("li.listing-item").append(this); 
 
     });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div id="news-articles"> 
 
    <ul class="display-posts-listing"> 
 
    <li class="listing-item"> 
 
     <span></span> 
 
     <span></span> 
 
     <span></span> 
 
     <span class="category-display"></span> 
 
    </li> 
 
    </ul> 
 
</div>

Answer 1

$.prev()は、前の兄弟を選択します。

$(".listing-item").each(function(){ 
    $this = $(this); 
    var $elem = $this.find(".category-display").detach(); 
    $elem.appendTo($this); 
}); 

Answer 2

ちょうどLIにスパンを追加し、それが下

$('.listing-item').append(function() { 
 
    return $(this).find('.category-display'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div id="news-articles"> 
 
    <ul class="display-posts-listing"> 
 
    <li class="listing-item"> 
 
     <span>1</span> 
 
     <span class="category-display">4</span> 
 
     <span>2</span> 
 
     <span>3</span> 
 
    </li> 
 
    </ul> 
 
    <br /> 
 
    <ul class="display-posts-listing"> 
 
    <li class="listing-item"> 
 
     <span>1</span> 
 
     <span class="category-display">4</span> 
 
     <span>2</span> 
 
     <span>3</span> 
 
    </li> 
 
    </ul> 
 
</div>

になってしまいます：あなたは、私が代わりにこれと同じように書くでしょう $.parent()

を使用したいです