В обработчик клика передаётся объект события, а не элемент. А ещё значения
data-country
почему-то на русском - какого чёрта? Надо, чтобы были такими же, как и
id
у элементов
.tabcontent
.
Править атрибуты я конечно не буду, а код вот:
const tabLinks = document.querySelectorAll('.tablinks');
const tabContent = document.querySelectorAll('.tabcontent');
tabLinks.forEach(n => n.addEventListener('click', openTab));
function openTab({ currentTarget: t }) {
const { country } = t.dataset;
tabLinks.forEach(n => n.classList.toggle('active', n === t));
tabContent.forEach(n => n.classList.toggle('active', n.id === country));
// или, к чёрту data-атрибуты и id, можно индексами воспользоваться;
// конечно, в этом случае необходимо, чтобы .tablinks и соответствующие им
// .tabcontent были расположены в одинаковом порядке
const index = Array.prototype.indexOf.call(tabLinks, t);
tabLinks.forEach(n => n.classList.toggle('active', n === t));
tabContent.forEach((n, i) => n.classList.toggle('active', i === index));
}