Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery add next to (add after)

Tags:

jquery

HTML is
<a>ref</a>

I need to get
<a>ref</a>text

How can i do this? $('a').append('text') only insert text into <a></a>, not after it

like image 565
Qiao Avatar asked Apr 09 '10 13:04

Qiao


People also ask

What is insertAfter in jQuery?

jQuery insertAfter() Method The insertAfter() method inserts HTML elements after the selected elements. Tip: To insert HTML elements before the selected elements, use the insertBefore() method.

How do I append after an element?

First, select the ul element by its id ( menu ) using the getElementById() method. Second, create a new list item using the createElement() method. Third, use the insertAfter () method to insert a list item element after the last list item element.

What is the correct syntax to insert content after the div elements?

The jQuery after() method is used to insert content after the selected elements.

How do you use append and prepend?

The prepend() method inserts specified content at the beginning of the selected elements. Tip: To insert content at the end of the selected elements, use the append() method.


3 Answers

Use after or insertAfter:

$('a').after('text'); $('text').insertAfter('a'); 
like image 165
Jeff Sternal Avatar answered Sep 27 '22 23:09

Jeff Sternal


$('a').after("text"); 
like image 33
rahul Avatar answered Sep 28 '22 00:09

rahul


Using the following HTML:

<div class="container">
  <h2>Greetings</h2>
  <div class="inner">Hello</div>
  <div class="inner">Goodbye</div>
</div>

Content can be created and then inserted after several elements at once:

$('.inner').after('<p>Test</p>');

Each inner element gets this new content:

<div class="container">
  <h2>Greetings</h2>
  <div class="inner">Hello</div>
  <p>Test</p>
  <div class="inner">Goodbye</div>
  <p>Test</p>
</div>

An element in the DOM can also be selected and inserted after another element:

$('.container').after($('h2'));

If an element selected this way is inserted elsewhere, it will be moved rather than cloned:

<div class="container">
  <div class="inner">Hello</div>
  <div class="inner">Goodbye</div>
</div>
<h2>Greetings</h2>
like image 22
Deva.TamilanbanThevar Avatar answered Sep 27 '22 23:09

Deva.TamilanbanThevar