Thomas
Thomas

Reputation: 34188

How to insert any element after a certain element with jquery

suppose i have form and there is 10 text boxes. now i want to insert a dropdown or combo after 7th text box mean at eight position. how can i do it with jquery. any help with code snippet......or any hind. i know there is append() & prepend() function is there but with the help of above two function i can not insert any dropdown at certain position. i search google and found few hint like.

<div class="link">
       <input id="textBox" class="link" type="text" value="Skriv länk" />
       <br />
 </div>

does it work by jquery

$("#textBox").after("<p>Hello</p>");

$("input").after("<p>Hello</p>");

$("<p>Hello</p>").insertAfter("input");

what code i need to write to add a dropdown after textbox in 7th position? thanks

Upvotes: 0

Views: 134

Answers (4)

spring
spring

Reputation: 770

$("<select><option value='test'>test</option></select>").insertAfter($(".link input:nth-child(7)"));

DEMO http://jsfiddle.net/dQgCQ/

Upvotes: 1

user2026993
user2026993

Reputation:

If you have the ID (or anything else to identify it) of the 7th text box, you can use .after() anyway...

$("#textBox7").after(/* new element */);

See http://api.jquery.com/after/ for more information. The documentation of jQuery is really good written

Upvotes: 1

Dhaval Marthak
Dhaval Marthak

Reputation: 17366

Try eq()

$("input").eq(6).after("<p>Your dropdown</p>");

DEMO --> http://jsfiddle.net/64PaN/

Upvotes: 4

Anton
Anton

Reputation: 32581

Try using .eq() to get the position

$('input').eq(6).after('<p>Hello</p>');

Upvotes: 2

Related Questions