jQuery - 동일한 요소를 선택하여 부모에게 옮기기

Question

저는 현재 WordPress 기반의 웹 사이트에서 작업하고 있습니다. jQuery를 사용하여 블로그 게시물의 날짜를 이동하고 싶습니다. 다른 페이지에서 사용되기 때문에 템플릿을 편집 할 수 없습니다.

정확하게, 내가 .entry 제목 아래 .entry 시간 요소를 이동하고자하는 것은

여기에 HTML 코드입니다 : 여기

<div class="post-content-container"> 
    <h2 class="entry-title">Blog 1</h2> 
    <div class="entry-meta"> 
     <p class="entry-meta-details"> 
      <span class="entry-time"> 
       <span class="updated" style="display:none;">2014-06-24T13:58:52+00:00</span> 
       <time class="published">June 24th, 2014</time> 
      </span> 
     </p> 
</div> 
<div class="post-content-container"> 
    <h2 class="entry-title">Blog 2</h2> 
    <div class="entry-meta"> 
     <p class="entry-meta-details"> 
      <span class="entry-time"> 
       <span class="updated" style="display:none;">2014-06-20T13:58:52+00:00</span> 
       <time class="published">June 20th, 2014</time> 
      </span> 
     </p> 
</div> 
<div class="post-content-container"> 
    <h2 class="entry-title">Blog 3</h2> 
    <div class="entry-meta"> 
     <p class="entry-meta-details"> 
      <span class="entry-time"> 
       <span class="updated" style="display:none;">2014-05-20T13:58:52+00:00</span> 
       <time class="published">May 20th, 2014</time> 
      </span> 
     </p> 
</div> 

그리고 내가 사용하는 지금까지 한 일이다 jQuery :

jQuery(".post-content-container").find(".entry-time").each(function(){ 
      jQuery(this).appendTo(".entry-title"); 
    }); 

".entry-time"요소가 올바른 위치에 있지만 루프에 문제가 있습니다.

http://i.stack.imgur.com/FCA8G.png

당신이 날은 루프를 해결하는 데 도움이 수 없습니다 : 세 날짜는 각 블로그 제목 아래에 표시됩니다? 의

감사합니다, 데미안

Answer 1

때문에 .appendTo(".entry-title") 일치 세 항목의 제목마다 당신의 선택. 원하는 것은 각각의 특정 제목에 맞는 제목 만 일치시키는 것입니다. .entry-time. 이렇게하려면 DOM을 올바른 대상 (예 : DOM)으로 이동해야합니다. 한 가지 방법은 다음과 같습니다

물론

jQuery(".post-content-container").find(".entry-time").each(function(){ 
    var $this = jQuery(this); 
    $this.appendTo($this.closest(".post-content-container").find(".entry-title")); 
}); 

당신이 나중에는 같은 요소에 대한 DOM 여러 번 통과해야하지 않도록까지 .each를 당겨 초대들 그것을보고 :

jQuery(".post-content-container").each(function() { 
    var $this = jQuery(this); 
    $this.find(".entry-time").appendTo($this.find(".entry-title")); 
}); 

그리고 콜백의 본문은 자연 언어에 매우 가깝게 읽습니다.

Answer 2

현재 항목에 해당하는 특정 .entry-title을 선택하지 않았습니다.

jQuery(".post-content-container").find(".entry-time").each(function(){ 
    jQuery(this).appendTo($(this).closest(".entry-meta").prev(".entry-title")); 
});