Below is a link which toggles aria-hidden="true" to "false" on focues and returns to true onblur.
When you focus on the link the aria-hidden attribute will change to "false" and the text will read to screen reader user. But when they are navigating the table they will not hear the noise of that repeated as part of the row header every time they move to a new row..
Code Used
<a role="button"
class="table-arrow-up"
href="javascript:void(0);"
aria-expanded="false" aria-hidden="true"
id="p4" onfocus="focusFunction(this.id)"
onblur="blurFunction(this.id)"><span >Toggle
show/hide. Screen reader users, all text is available without show
hide.</span></a>
<script>
function focusFunction(x) {
if
(x == "p4") {
document.getElementById(x).setAttribute("aria-hidden",
"false");
}
}
function blurFunction(x) {
if (x == "p4") {
document.getElementById(x).setAttribute("aria-hidden",
"true");
}
}
</script></code>