How do i make a scrolldown to a specific tab content when using javascript:document.querySelector(‘#’).click() after the specific tab is opened

How do i make below hyperlink scroll over to that tab’s content..i’ve used “javascript:document.querySelector(‘#tb’).click()” and tab is opened but u it doenst scroll down over

Here is my source code

This is the css for the tabs and page

body {font-family: Arial;}

.tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}

.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
  font-size: 17px;
}

.tab button:hover {
  background-color: #ddd;
}

.tab button.active {
  background-color: #ccc;
}

.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
}

Below (3rd line)i used “javascript:document.querySelector(‘#tb’).click()” to open the hyperlinked tab..but how do make it scroll over to that tab’s content

<h2>Tabs</h2>
    <p>How do i make a scrolldown to a specific tab content when the hyperlink below is clicked?</p>
    
 <a href="javascript:document.querySelector('#tb').click()">This link will open the tokyo tab..but how do i implement a scroll over?</a>
<br>
<br>
<br>
<img src="D:DocumentsTCOR22000652travel.jpg" alt="Girl in a jacket" width="600" height="500">

<br>
<br>
<br>
<br>
<br>
<br>
<br>
    <div class="tab">
      <button class="tablinks" onclick="openCity(event, 'London')">London</button>
      <button class="tablinks" onclick="openCity(event, 'Paris')">Paris</button>
      <button class="tablinks" id="tb" onclick="openCity(event, 'Tokyo')">Tokyo</button>
    </div>

    <div id="London" class="tabcontent">
      <h3>London</h3>
      <p>London is the capital city of England.</p>
    </div>

    <div id="Paris" class="tabcontent">
      <h3>Paris</h3>
      <p>Paris is the capital of France.</p>
    </div>

    <div id="Tokyo" class="tabcontent">
      <h3>Tokyo</h3>
      <p>Tokyo is the capital of Japan.</p>
      <img src="D:DocumentsTCOR22000656tokyo.jpg" alt="Girl in a jacket" width="500" height="600">
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rhoncus auctor commodo. Duis condimentum massa mi, vitae finibus nisl cursus ac. Interdum et malesuada fames ac ante ipsum primis in faucibus. In quis ante tortor. Donec quis ornare turpis.
        Aliquam dignissim sem diam, at tristique leo blandit non. Vivamus neque nisl, dictum sit amet vulputate ac, congue et massa. Aenean a faucibus tellus, a interdum nisi. Aliquam non nisl sed metus pharetra facilisis. Maecenas eu dictum urna, ornare
        pharetra felis. Nunc maximus mauris in sem cursus vehicula.</p>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rhoncus auctor commodo. Duis condimentum massa mi, vitae finibus nisl cursus ac. Interdum et malesuada fames ac ante ipsum primis in faucibus. In quis ante tortor. Donec quis ornare turpis.
        Aliquam dignissim sem diam, at tristique leo blandit non. Vivamus neque nisl, dictum sit amet vulputate ac, congue et massa. Aenean a faucibus tellus, a interdum nisi. Aliquam non nisl sed metus pharetra facilisis. Maecenas eu dictum urna, ornare
        pharetra felis. Nunc maximus mauris in sem cursus vehicula.</p>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rhoncus auctor commodo. Duis condimentum massa mi, vitae finibus nisl cursus ac. Interdum et malesuada fames ac ante ipsum primis in faucibus. In quis ante tortor. Donec quis ornare turpis.
        Aliquam dignissim sem diam, at tristique leo blandit non. Vivamus neque nisl, dictum sit amet vulputate ac, congue et massa. Aenean a faucibus tellus, a interdum nisi. Aliquam non nisl sed metus pharetra facilisis. Maecenas eu dictum urna, ornare
        pharetra felis. Nunc maximus mauris in sem cursus vehicula.</p>
         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rhoncus auctor commodo. Duis condimentum massa mi, vitae finibus nisl cursus ac. Interdum et malesuada fames ac ante ipsum primis in faucibus. In quis ante tortor. Donec quis ornare turpis.
        Aliquam dignissim sem diam, at tristique leo blandit non. Vivamus neque nisl, dictum sit amet vulputate ac, congue et massa. Aenean a faucibus tellus, a interdum nisi. Aliquam non nisl sed metus pharetra facilisis. Maecenas eu dictum urna, ornare
        pharetra felis. Nunc maximus mauris in sem cursus vehicula.</p>
         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rhoncus auctor commodo. Duis condimentum massa mi, vitae finibus nisl cursus ac. Interdum et malesuada fames ac ante ipsum primis in faucibus. In quis ante tortor. Donec quis ornare turpis.
        Aliquam dignissim sem diam, at tristique leo blandit non. Vivamus neque nisl, dictum sit amet vulputate ac, congue et massa. Aenean a faucibus tellus, a interdum nisi. Aliquam non nisl sed metus pharetra facilisis. Maecenas eu dictum urna, ornare
        pharetra felis. Nunc maximus mauris in sem cursus vehicula.</p>
         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rhoncus auctor commodo. Duis condimentum massa mi, vitae finibus nisl cursus ac. Interdum et malesuada fames ac ante ipsum primis in faucibus. In quis ante tortor. Donec quis ornare turpis.
        Aliquam dignissim sem diam, at tristique leo blandit non. Vivamus neque nisl, dictum sit amet vulputate ac, congue et massa. Aenean a faucibus tellus, a interdum nisi. Aliquam non nisl sed metus pharetra facilisis. Maecenas eu dictum urna, ornare
        pharetra felis. Nunc maximus mauris in sem cursus vehicula.</p>
         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rhoncus auctor commodo. Duis condimentum massa mi, vitae finibus nisl cursus ac. Interdum et malesuada fames ac ante ipsum primis in faucibus. In quis ante tortor. Donec quis ornare turpis.
        Aliquam dignissim sem diam, at tristique leo blandit non. Vivamus neque nisl, dictum sit amet vulputate ac, congue et massa. Aenean a faucibus tellus, a interdum nisi. Aliquam non nisl sed metus pharetra facilisis. Maecenas eu dictum urna, ornare
        pharetra felis. Nunc maximus mauris in sem cursus vehicula.</p>
         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rhoncus auctor commodo. Duis condimentum massa mi, vitae finibus nisl cursus ac. Interdum et malesuada fames ac ante ipsum primis in faucibus. In quis ante tortor. Donec quis ornare turpis.
        Aliquam dignissim sem diam, at tristique leo blandit non. Vivamus neque nisl, dictum sit amet vulputate ac, congue et massa. Aenean a faucibus tellus, a interdum nisi. Aliquam non nisl sed metus pharetra facilisis. Maecenas eu dictum urna, ornare
        pharetra felis. Nunc maximus mauris in sem cursus vehicula.</p>

Here is the javascript for the tabs

function openCity(evt, cityName) {
  var i, tabcontent, tablinks;
  tabcontent = document.getElementsByClassName("tabcontent");
  for (i = 0; i < tabcontent.length; i++) {
    tabcontent[i].style.display = "none";
  }
  tablinks = document.getElementsByClassName("tablinks");
  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";
}