Search code examples
jqueryclone

Clone a div exclude last child element

I want to clone a whole div but exclude the last <p> element in that div. How to use jQuery to do that?

Original div:

<div class="clone">
    <p>Content<p>
    <p>Content<p>
    <p>Content<p>
    <p class="exclude">Content<p>
</div>

I want this after clone:

<div class="clone">
    <p>Content<p>
    <p>Content<p>
    <p>Content<p>
    <p class="exclude">Content<p>
</div>
<div class="clone">
    <p>Content<p>
    <p>Content<p>
    <p>Content<p>
</div>
Solution

  • clone the element then remove the last child

    var clone = $('.clone').clone().find('.exclude').remove().end()

    or

    var clone = $('.clone').clone().children(':last').remove().end()

    Demo: Fiddle