在每个父div中将子div移动到另一个子div之上

时间:2014-04-28 16:13:31

标签: jquery

使用:contains(),我试图在每个父div中定位特定的子div,并将其移到上面(insertBefore)所有其他子div。

<div class="roomRateRoomType">
    <div class="rateListing roomsView">
        <div class="rateTypeLineItems">

            <!-- Non-Best Flex Rate -->
            <div class="regularRates roomsView"> <span>Advance Saver Rate & Deals</span>

                <p>Lorem Ipsum.</p>
            </div>

            <!-- Best Flexible Rate -->
            <div class="regularRates roomsView">
                <div class="upsellHeader"> <span class="groupHeader">Best Flexible Rate &amp; Deals</span>

                    <p>Lorem Ipsum.</p>
                </div>
            </div>

        </div>
    </div>

    <div class="rateListing roomsView">
        <div class="rateTypeLineItems">

            <!-- Non-Best Flex Rate -->
            <div class="regularRates roomsView"> <span>Some Other Advance Saver Rate & Deals</span>

                <p>Lorem Ipsum.</p>
            </div>

            <!-- Best Flexible Rate -->
            <div class="regularRates roomsView">
                <div class="upsellHeader"> <span class="groupHeader">Best Flexible Rate &amp; Deals</span>

                    <p>Lorem Ipsum.</p>
                </div>
            </div>

        </div>
    </div>

    <div class="rateListing roomsView">
        <div class="rateTypeLineItems">

            <!-- Non-Best Flex Rate -->
            <div class="regularRates roomsView"> <span>And One More Advance Saver Rate & Deals</span>

                <p>Lorem Ipsum.</p>
            </div>

            <!-- Best Flexible Rate -->
            <div class="regularRates roomsView">
                <div class="upsellHeader"> <span class="groupHeader">Best Flexible Rate &amp; Deals</span>

                    <p>Lorem Ipsum.</p>
                </div>
            </div>

        </div>
    </div>    
</div>
<!-- */ END .roomRateRoomType -->

//move each Best Flex div above all siblings
$('.regularRates.roomsView').each(function() {
    $('.regularRates.roomsView:contains("Best Flexible Rate")').insertBefore('.regularRates.roomsView:eq(0)');
});

这是我的fiddle。我理解为什么我的目标孩子会被移到第一个父级的顶部。如何让我的脚本将每个孩子保留在其相对父母中?

感谢您的帮助!

1 个答案:

答案 0 :(得分:0)

尝试:

$('.rateTypeLineItems').each(function () {
    $(this).find('.regularRates.roomsView:contains("Best Flexible Rate")').prependTo(this);
});

<强> jsFiddle example