Paul12345,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.none {
display: none;
}
.active {
background-color: hsla(240, 100%, 40%, 1);
color: hsla(0, 0%, 100%, 1);
}
</style>
</head>
<body>
<!-- Tab -->
<span class='tab active'>Ссылка 1</span>
<span class='tab'>Ссылка 2</span>
<span class='tab'>Ссылка 3</span>
<div class="tab-content">
<div class="c">Текст 1</div>
<div class="c none">Текст 2</div>
<div class="c none">Текст 3</div>
</div>
<!-- End Tab -->
<script type="text/javascript">
var tabs = document.querySelectorAll(".tab");
var con = document.querySelectorAll(".c");
var temp = 0;
[].forEach.call(tabs, function(item, i) {
item.addEventListener("click", function() {
item.classList.add("active");
tabs[temp].classList.remove("active")
con[temp].classList.add("none");
temp = i;
con[temp].classList.remove("none")
})
});
</script>
</body>
</html>