How add a span after innerhtml text inside a div using jQuery or javascript?

I have a document structure looks like this:

<div class="text">
     Send email 
</div>

How can I insert a span tag after the text so that the final document structure looks like:

<div class="text">
     Send email <span class="envelope"></span>
</div>

I have a document structure looks like this:

<div class="text">
     Send email 
</div>

How can I insert a span tag after the text so that the final document structure looks like:

<div class="text">
     Send email <span class="envelope"></span>
</div>

Share Improve this question asked Dec 11, 2017 at 7:53 ambar 2,2537 gold badges28 silver badges33 bronze badges

Add a ment |

3 Answers 3

Sorted by: Reset to default 3

Just use jQuery#append. I also print the html structure of the div to see what it is like.

const div = $('.text');

div.append('<span class="envelope">Envelop</span>');

console.log(div.html());

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="text"> Send email </div>

you need to use append() method of jquery library it will add span after text.

$( "div.text" ).append( '<span class="envelope"></span>' );

If you want to use Vanilla JS, Try this.

 document.querySelector('.text').innerHTML += `<span class="envelope">sss</span>`;

<div class="text">
 TEXT
</div>

发布者：admin，转转请注明出处：http://www.yc00.com/questions/1745283806a4620437.html