탭메뉴 세개 사용하고 싶습니다. 채택완료

.tabcontent2 {

  display: none;

  padding: 6px 12px;

  border: 1px solid #ccc;

  border-top: none;

}

<div class="tab">

  <button class="tablinks2" onclick="openCity2(event, 'London2')" id="defaultOpen2">444</button>

  <button class="tablinks2" onclick="openCity2(event, 'Paris2')">555</button>

  <button class="tablinks2" onclick="openCity2(event, 'Tokyo2')">666</button>

</div></p>

<p><div id="London2" class="tabcontent2">

  <h3>444</h3>

  <p>44444</p>

</div></p>

<p><div id="Paris2" class="tabcontent2">

  <h3>555</h3>

  <p>55555</p> 

</div></p>

<p><div id="Tokyo2" class="tabcontent2">

  <h3>666</h3>

  <p>66666</p>

</div>

<script>

function openCity2(evt, cityName) {

  var i, tabcontent, tablinks;

  tabcontent = document.getElementsByClassName("tabcontent2");

  for (i = 0; i < tabcontent.length; i++) {

    tabcontent[i].style.display = "none";

  }

  tablinks = document.getElementsByClassName("tablinks2");

  for (i = 0; i < tablinks.length; i++) {

    tablinks[i].className = tablinks[i].className.replace(" active", "");

  }

  document.getElementById(cityName).style.display = "block";

  evt.currentTarget.className += " active";

}</p>

<p>// Get the element with id="defaultOpen" and click on it

document.getElementById("defaultOpen2").click();

</script>