Insert element between index x, y

Question

I try to insert list item between list elements:

$('#deals-providers dt').each(function(index) {
        if (index == 10) {          

            $(this).insertBefore($('<dt/>').text('More item'));

        }
});

but it doesn't work. How can I do this?

How/Where is index updated?

Nivas
– Nivas

2011-09-01 11:08:03 +00:00
Commented Sep 1, 2011 at 11:08 — Nivas
– Nivas, Commented Sep 1, 2011 at 11:08

Richard Dalton · Accepted Answer · 2011-09-01 11:19:58Z

2

This does what you want:

$('#deals-providers dt:eq(9)').after('<dt>More item</dt>');

The :eq() selects the item at that index.

JSBin Example

edited Sep 1, 2011 at 11:19

answered Sep 1, 2011 at 11:10

Richard Dalton

35.8k6 gold badges75 silver badges92 bronze badges

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

Comments

kabaros · Accepted Answer · 2011-09-01 11:21:45Z

2

try this:

edit:

$('dt:nth(10)').before('<dt>More item</dt>');

edited Sep 1, 2011 at 11:21

answered Sep 1, 2011 at 11:05

kabaros

5,1932 gold badges25 silver badges35 bronze badges

4 Comments

Richard Dalton Over a year ago

I don't think you want the [10] there as that gives you the dom element rather than the 11th jQuery object in the collection - jsbin.com/ezopix/2/edit#preview

DevMed Over a year ago

I try $('#deals-providers dt')[10].insertBefore($('<dt>More</dt>')); too, but all above gives me jQuery error, probably it is old version

Richard Dalton Over a year ago

@jadept No, it's because it's trying to call insertBefore on the 11th dom element which doesn't have a method called insertBefore.

kabaros Over a year ago

this works on jsbin for the example of Richard $('dt:nth(10)').before('<dt>More item</dt>');

m90 · Accepted Answer · 2011-09-01 11:07:30Z

1

You could also use the :nth-child selector

See: http://jsfiddle.net/L2tk2/1/

answered Sep 1, 2011 at 11:07

m90

11.8k16 gold badges69 silver badges120 bronze badges

Comments

Thomas Li · Accepted Answer · 2011-09-01 11:08:39Z

0

$('#deals-providers dt').each(function(index) {
        if (index == 10) {          
            $(this).insertBefore($('dt:contains("More item")'));
        }
});

answered Sep 1, 2011 at 11:08

Thomas Li

3,33820 silver badges14 bronze badges

Comments

Gary Chambers · Accepted Answer · 2011-09-01 11:15:40Z

0

You can use the jQuery#eq method to return an element at a designated index. This will return a jQuery object, unlike jQuery#get, which returns an element node.

$('#deals-providers dt').eq(10).before(
  $('<dt>').text('More text')
);

answered Sep 1, 2011 at 11:15

Gary Chambers

25.9k5 gold badges37 silver badges31 bronze badges

Collectives™ on Stack Overflow

Insert element between index x, y

5 Answers 5

Comments

4 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

4 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related