How to change the value of <a> tag using javascript?

Question

Here my html code

<a href="myfile.html" id='tagId'>Old File</>

I want to change the value of tag with name "New File"

So i wrote javascript like document.getElementById("tagId").value='New File';

I thought output like <a href="myfile.html" id='tagId'>New File</a>

But it's not working .can anyone help ?

Answer 1

Use .innerHTML or .innerText

document.getElementById("tagId").innerHTML="new File",

OR

document.getElementById("tagId").innerText="new File",

OR Note: Not all browsers support innerTEXT, so use textContent if you want to change the text only,

Reference Stack overflow answer

So like @Amith Joki said, use like

 document.getElementById("tagId").textContent="new File",

Since <a> tag doesn't have value property, you need change the html of anchor tags.

Using Jquery

$("#tagId").html("new File");

OR

$("#tagId").text("new File");

Edit

If you want to change the href using javascript, USe like this

 document.getElementById("tagId").href="new href";

USing jquery,

$("#tagid").attr("href","new value");

Answer 2

You can use .html() to get/set html:

 $('#tagId').html('New File')

OR

 $("#tagId").text("new File");