How to get text of link in jQuery

Question

My objective is to display the text or inner html of a link after the link itself essentially creating a duplicate.

At this point, when hovering over a link, I can display the text TEST after the link with:

.link
{
   color:aqua;
   text-decoration: none;
   background-color: none;
}
.link:hover span {display:none;
.link:hover:after {content:"TEST";}

However, I would like the text to be "CoDe". How would one display the actual text of the link itself after the link with jQuery?

I have tried simply to log the content of the hovered link to console, but this does not work:

$('#link').hover(function() {
    console.log($(this).text());
});

What am I doing wrong and how can I get the the text of the link and change the content of link:hover:after with jQuery ?