Replace the text inside <a> with <img>-CodePudding

I have this :

<div >
    <a href="my-link" >&lt;&lt;Previous</a>
</div>

I'm trying to find all instances of the class blog-page-nav-previous and replace the text inside the <a> tag: <<Previous with an image of my own.

How do I do that?

CodePudding user response：

You could maybe try the following:

<div >
 <a href="my-link" ><span>Previous</span></a>
</div>

Jquery:

$('.blog-page-nav-previous span').text('<img src="image.jpg" alt="Image Description">');

CodePudding user response：

You could try this

var a = document.getElementsByClassName("blog-page-nav-previous");

a.forEach(function(a){
  a.outerHTML = '<img src="images/image.jpg" alt="image">'
});

If you are trying to only replace the contents of the element you could replace a.outerHTML with a.innerHTML