How to remove text between <a> with javascript

Question

I am using javascript and jquery to change the text inside of an a tag. I was reading that document.getElementById("yearA").innerHTML = ''; would remove the text but it isn't working. I'm not sure if it's because I am adding text to the a tag then trying to remove it or not. Any help with this would be appreciated. Here is my html

document.getElementById("filter-div").style.visibility = "visible";
document.getElementById("yearA").style.visibility = "visible";
document.getElementById("yearA").innerHTML += 'Remove Link';
console.log('Link added')

function hideYear() {
  document.getElementById("yearA").innerHTML = '';
  console.log('Link removed')
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="hidden" id="hiddenTag" />
<div id="filter-div" class="filter-div" style="visibility: hidden;">
  <a id="yearA" onclick="hideYear()" style="visibility: hidden;"></a>
</div>

Answer 1

Jquery based solution

you may try:

$('#yearA').text("");