jQuery 只有“这个”。简单的问题

Question

我只是陷入了一个简单的 jQuery 问题。 我正在尝试将每个 span 元素添加到 p 元素之前，但是 jQuery 将每个跨度重复 3 次（因为我有 3 个跨度元素）。好吧，这很难解释。

看看 Fiddle 代码 - http://jsfiddle.net/fTjcy/1/< /strong>

HTML：

<div class="events">

<div class="event">
<span class="red">31.08.11  - </span>
<p>...</p>

</div> <!-- END OF New -->



<div class="event">
<span class="red">28.08.2011  - </span><p>...</p>
</div> <!-- END OF New -->



<div class="event">
<span class="red">20.08.2011  - </span><p>...</p>
</div> <!-- END OF New -->

</div>

我想实现：

<div class="events">

<div class="event">

<p><span class="red">31.08.11  - </span>...</p>
</div> <!-- END OF New -->



<div class="event">
<p><span class="red">28.08.2011  - </span>...</p>
</div> <!-- END OF New -->



<div class="event">
<p><span class="red">20.08.2011  - </span>...</p>
</div> <!-- END OF New -->

</div>

jQuery：

$('.event span.red').hide().prependTo('.event p').show();

Answer 1

试试这个

$('.event span.red').hide().each(function(i) {
    $(this).prependTo($('.event p').eq(i)).show();
});

Answer 2

$('.event span.red').each(function() {
    var paragraph = $(this).closest('.event').find('p');
    $(this).hide().prependTo(paragraph).show();
});

Answer 3

您只需定位当前的 span，并将其添加到相对的 p 前面。

var p = $('.event p');

$('.event span.red').hide().each(function(i) {
    $(this).prependTo( p[ i ] ).show();
});

示例： http://jsfiddle.net/fTjcy/3/