MAZ
MAZ

Reputation: 214

Insert div after a number of anothers divs

I need to insert the div-to-insert after a specific numbers of item using Javascript

<div id="groups">
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
</div>
<div id="div-to-insert"></div>

I tried this JS code but its not works :

$('#div-to-insert').eq(2).after('<div class="item"></div>');

Upvotes: 1

Views: 58

Answers (1)

NullDev
NullDev

Reputation: 7303

The argument of the after() function is what you want to insert. Not the element you want to insert it after.

In your case I'd use the nth-child selector directly:

$("#groups > div.item:nth-child(2)").after('<div id="div-to-insert">new</div>');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="groups">
    <div class="item">1</div>
    <div class="item">2</div>
    <div class="item">3</div>
    <div class="item">4</div>
</div>

Upvotes: 1

Related Questions