<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Событие onclick</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<div class='block-card'>
<div class='xQQ'>
<a name="a0" class='x' onclick='btnList()'>Ссылочка1</a>
<a name="a1" class='x' onclick='btnList()'>Ссылочка1</a>
<a name="a2" class='x' onclick='btnList()'>Ссылочка1</a>
</div>
<div class='box-2'>
<div name="d0" class='xx'>Вот он 1</div>
<div name="d1" class='xx' hidden>Вот он 2</div>
<div name="d2" class='xx' hidden>Вот он 3</div>
</div>
</div>
<script>
function btnList() {
var q = event.target.getAttribute('name'),
index = q.charAt(1);
event.target.parentNode.parentNode.children[1]..style.display = 'none';
event.target.parentNode.parentNode.children[1].children[index].style.display = 'block';
}
</script>
</body>
</html>
hidden для скрытия/отображения табов. Лучше для этого задействовать класс, который временно прячет элемент. Например, Bootstrap'овский .d-none 
Средний
Простой
Средний
Простой