Using JavaScript variable inside an anchor tag's href attribute

Question

Consider I have a JavaScript variable named link which contains a URL like this: www.google.com. I need to include this variable in href attribute in 2 places, like:

<a href="link">link</a>

This should return something like this: Google

I tried various ways but failed. Is it possible to do like this? The JavaScript variables should be used at both places.

Note: I need to use the variable inside <a> tag also

Answer 1

Assume you have the following in your HTML

<a href="link" class='dynamicLink'>link</a>
<a href="link" class='dynamicLink'>link</a>

You can do the following

var href = 'http://www.google.com'; //any other link as wish
var links = document.getElementsByClassName('dynamicLink');

Array.from(links).forEach(link => {
  link.href = href;
  link.innerHTML = href.replace('http://', '');
});

JSFiddle

Answer 2

You can use the following code.

<a id="myLink" href="link">link</a>

in your javascript try

<script>
    var link = "http://www.google.com/";
    document.getElementById('myLink').setAttribute("href",link);
    document.getElementById('myLink').innerHTML = link;
    // Here the link is your javascript variable that contains the url.
</script>