How to add a sub parent class inside the parent class using Jquery-CodePudding

Hi I want to add a sub parent class to my parent class using jQuery.

Previously I've tried this:

$('.my-parent').wrap('<div ></div>');

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div >
    <div >1</div>
    <div >2</div>
    <div >3</div>
    <div >4</div>
</div>

But this one inserts the class outside of my parent, not inside.

What I want to achieve is like this html structure:

<div >
    <div >
        <div ></div>
        <div ></div>
        <div ></div>
        <div ></div>
    </div>
</div>

Is this achievable? Any help would be great. Thanks.

CodePudding user response：

You need wrapInner function.

$('.my-parent').wrapInner('<div ></div>');

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div >
    <div >1</div>
    <div >2</div>
    <div >3</div>
    <div >4</div>
</div>

For more resources.

https://api.jquery.com/wrapinner/