Как добавить текстовый контент из массива строк в новый элемент по нажатию кнопки?

Имеется массив строк, задача использовать эти названия как текстовый контент динамически создающегося элемента - <li><a> text </a></li> - по нажатию кнопки(button) которая добавляет этот элемент на страницу с НОВЫМ текстовым контентом взятым из массива строк. После повторного нажатия элемент добавляется, но текстовый контент не меняется(который должен был взят из массива строк). Как решить такую проблему? Помогите пожалуйста. Код:

const addNameElem = ['PHP', 'Go', 'Phyton', 'MySQL', 'Angular'];

const addBtn = document.querySelector('.js-add-btn');
let labelContentElem = addNameElem[Math.floor(Math.random() * addNameElem.length)];


addBtn.addEventListener('click', onAddBtnClick);

function onAddBtnClick() {
    const item = document.createElement('li');
    const tagLink = document.createElement('a');

    tagLink.classList.add('btn');
    tagLink.textContent = `${labelContentElem}`;
    item.appendChild(tagLink);

    nav.appendChild(item);
    [...new Set(labelContentElem)];
    // labelContentElem += 1;
}