Add index to appended element Jquery

Question

I want to order items inside a div,I have list fetched dynamically structured like this:

<div class="array-placeholder">
<div class="tag">....</div> #index 0 
<div class="tag">....</div> #index 1
<div class="tag">....</div> #index 2
</div>

I want to append an element

<div class="array-placeholder">
<div class="tag">....</div> #index 0 
<div class="tag">....</div> #index 1
<div class="tag">....</div> #index 2
<li><div class="tag">....</div></li> # index =0 but it should be 3
</div>

I tried to solve this like this but the index is always 0

newElem.insertAfter($(".array-placeholder").find('.tag').eq((listLength-1)));

Thanks for your help.

<li> inside <div class="array-placeholder"> is invalid HTML — User863
– User863, Commented Dec 27, 2019 at 11:13
Inside "eq()" method too much brackets. It should .eq(listLength-1)); — Hanif
– Hanif, Commented Dec 27, 2019 at 11:44

Alexander van Oostenrijk · Accepted Answer · 2019-12-27 11:11:55Z

2

Rather than insertAfter, it would be simpler to use jQuery's append method:

$(".array_placeholder").append(newElem);

This will simply tack the new element onto the list as the last child.

answered Dec 27, 2019 at 11:11

Alexander van Oostenrijk

4,7843 gold badges25 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Kamel Mili Over a year ago

$(".array_placeholder") has other children that are dynamic that I didn't mention but it seems that I found the solution which is finding a way to delete the appended <li>

Hanif · Accepted Answer · 2019-12-27 12:08:13Z

1

Have you tried with jQuery :last-child selector like following?

var newElem = '<li><div class="tag">....</div></li>';
$(newElem).insertAfter($(".array-placeholder .tag:last-child"));

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="array-placeholder">
<div class="tag">....</div>
<div class="tag">....</div>
<div class="tag">....</div>
<div class="tag">las tag</div>
</div>

answered Dec 27, 2019 at 12:08

Hanif

3,8451 gold badge14 silver badges20 bronze badges

Comments

Kamel Mili · Accepted Answer · 2019-12-27 11:30:35Z

1

this will definitely work while using jquery

var newElem = '<div class="tag">....</div>';
$(".array-placeholder").append(newElem);

edited Dec 27, 2019 at 11:30

Kamel Mili

1,4643 gold badges20 silver badges45 bronze badges

answered Dec 27, 2019 at 11:28

chandan gupta

814 bronze badges

Collectives™ on Stack Overflow

Add index to appended element Jquery

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related