How to edit all the href's tags on click other element?

Question

I have a navbar width links to all the months with a get attribute to the month and the year.

<a href="?ano=2018&mes=09" class="change">Sep</a>
<a href="?ano=2018&mes=10" class="change">Oct</a>
<a href="?ano=2018&mes=11" class="change">Nov</a>
<a href="?ano=2018&mes=12" class="change">Dec</a>

I want to add another get attr to all the tags when I'll click another element in the page, something like this:

<button onclick="add-to-href('&element=1')on-every('.change')">Element 1</button>

<button onclick="add-to-href('&element=2')on-every('.change')">Element 2</button>

I don't need so much to change the tag when clic other button, just with an adding element i'll be glad =)

The final result on the whole page should look like this:

<a href="?ano=2018&mes=09&element=1" class="change">Sep</a>
<a href="?ano=2018&mes=10&element=1" class="change">Oct</a>
<a href="?ano=2018&mes=11&element=1" class="change">Nov</a>
<a href="?ano=2018&mes=12&element=1" class="change">Dec</a>

Sorry for my english

Answer 1

add this in your onClick function

document.querySelectorAll(".change").forEach(v => {
 v.setAttribute('href', v.getAttribute('href') + '&element=1');
});