자바스크립트 문의좀 드릴께요

자꾸 질문해서 죄송합니다. ㅜㅜ

버튼 클릭시 class .active가 활성화되고 다른버튼 클릭시 해당버튼은 none으로 수졍하려는데요

이것저것 해봐도 안되네요... 

어떻게 해야되는건지 좀 부탁드릴께요

<style>

.tabcontent{color:#eee;}

.active{color:#111;}

<style>

<button class="tablink" onclick="openPage('Home', this, 'red')">Home</button>
<button class="tablink" onclick="openPage('News', this, 'green')">News</button>

<div id="Home" class="tabcontent">내용</div>

<div id="Home" class="tabcontent">내용</div>

function openPage(pageName,elmnt,color) {
  var i, tabcontent, tablinks;
  tabcontent = document.getElementsByClassName("tabcontent");
  for (i = 0; i < tabcontent.length; i++) {
    tabcontent[i].style.display = "none";
  }
  tablinks = document.getElementsByClassName("tablink");
  for (i = 0; i < tablinks.length; i++) {
    tablinks[i].style.backgroundColor = "";
  }
  document.getElementById(pageName).style.display = "block";
  elmnt.style.backgroundColor = color;
}