Panggil fungsi JavaScript dengan onclick event di halaman html lain

Hallo, Asslamualaikum...

Saya sedang membuat sebuah "Website Portfolio" pribadi yang dimana ada 2 halaman html.

di halaman Pertama ada portfolio.html, Saya memakai Javascript untuk Filter Category dan Default Category activenya adalah Show All,

nah,.. di halaman Kedua index.html,  Saya ada button yang me-Redirect ke halaman portfolio.html.

Pertanyaan Saya : "Cara membuat button yang ada di index.html supaya langsung me-Redirect ke halaman portfolio.html & otomatis Default Category activenya ke Category Programming gimana ya?"

Mohon Tanggapan & Bantuannya, Terima Kasih.

ini Code button di index.html

<a href="menu/portfolio.html#myprojects"><button onclick="filterSelection('programming')">Read More</button></a>

ini Code di portfolio.html

    <!-- Content Portfolio -->
    <div class="portfolio">

        <!-- FILTER BUTTON -->
        <div id="myBtnContainer">
            <a href="#myprojects"><button class="btn active" onclick="filterSelection('all')">Show all</button></a>
            <a href="#myprojects"><button class="btn" onclick="filterSelection('programming')">Programming</button></a>
            <a href="#myprojects"><button class="btn" onclick="filterSelection('game')">Game Development</button></a>
            <a href="#myprojects"><button class="btn" onclick="filterSelection('design')">Graphic Design</button></a>
            <a href="#myprojects"><button class="btn" onclick="filterSelection('3d')">3D Creation</button></a>
        </div>

        <!-- Card Portfolio -->
          <div class="container">
              <!-- Card Portfolio -->
            <div class="filterDiv programming">
                <a href="../index.html">
              <div id="card">
                  <div class="card-banner">
                      <p class="category-tag banner">Programming</p>
                      <img class="banner-img" src='https://images.unsplash.com/photo-1515879218367-8466d910aaa4?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=400&fit=max&ixid=eyJhcHBfaWQiOjE0NTg5fQ' alt=''>
                  </div>
                  <div class="card-body">
                      <p class="blog-hashtag"><i class="fas fa-calendar-alt"></i> Kamis, 19 November 2020</p>
                      <h2 class="blog-title">What is the future of front end development?</h2>
                      <p class="blog-description">My thoughts on the future of front end web development</p>
                  </div>
              </div>
                </a>
            </div>
            <div class="filterDiv 3d">
                <a href="../index.html">
              <div id="card">
                  <div class="card-banner">
                      <p class="category-tag banner">3D Creation</p>
                      <img class="banner-img" src='https://images.unsplash.com/photo-1413708617479-50918bc877eb?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=400&fit=max&ixid=eyJhcHBfaWQiOjE0NTg5fQ' alt=''>
                  </div>
                  <div class="card-body">
                      <p class="blog-hashtag"><i class="fas fa-calendar-alt"></i> Kamis, 19 November 2020</p></p>
                      <h2 class="blog-title">Photography gear you need this year</h2>
                      <p class="blog-description">Looking to upgrade your gear? Here is the list of the best photography tools for this year</p>
                  </div>
              </div>
                </a>
            </div>
            <div class="filterDiv design">
                <a href="../index.html">
              <div id="card">
                  <div class="card-banner">
                      <p class="category-tag banner">Graphic Design</p>
                      <img class="banner-img" src='https://images.unsplash.com/photo-1592496001020-d31bd830651f?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=400&fit=max&ixid=eyJhcHBfaWQiOjE0NTg5fQ' alt=''>
                  </div>
                  <div class="card-body">
                      <p class="blog-hashtag"><i class="fas fa-calendar-alt"></i> Kamis, 19 November 2020</p></p>
                      <h2 class="blog-title">Mediation and Mental Wellness Best Practices</h2>
                      <p class="blog-description">Mediation has transformed my life. These are the best practices to get into the habit</p>
                  </div>
              </div>
                </a>
            </div>
            <div class="filterDiv programming">
                <a href="../index.html">
              <div id="card">
                  <div class="card-banner">
                      <p class="category-tag banner">Programming</p>
                      <img class="banner-img" src='https://images.unsplash.com/photo-1515879218367-8466d910aaa4?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=400&fit=max&ixid=eyJhcHBfaWQiOjE0NTg5fQ' alt=''>
                  </div>
                  <div class="card-body">
                      <p class="blog-hashtag"><i class="fas fa-calendar-alt"></i> Kamis, 19 November 2020</p>
                      <h2 class="blog-title">What is the future of front end development?</h2>
                      <p class="blog-description">My thoughts on the future of front end web development</p>
                  </div>
              </div>
                </a>
            </div>
            <div class="filterDiv 3d">
                <a href="../index.html">
              <div id="card">
                  <div class="card-banner">
                      <p class="category-tag banner">3D Creation</p>
                      <img class="banner-img" src='https://images.unsplash.com/photo-1413708617479-50918bc877eb?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=400&fit=max&ixid=eyJhcHBfaWQiOjE0NTg5fQ' alt=''>
                  </div>
                  <div class="card-body">
                      <p class="blog-hashtag"><i class="fas fa-calendar-alt"></i> Kamis, 19 November 2020</p></p>
                      <h2 class="blog-title">Photography gear you need this year</h2>
                      <p class="blog-description">Looking to upgrade your gear? Here is the list of the best photography tools for this year</p>
                  </div>
              </div>
                </a>
            </div>
            <div class="filterDiv design">
                <a href="../index.html">
              <div id="card">
                  <div class="card-banner">
                      <p class="category-tag banner">Graphic Design</p>
                      <img class="banner-img" src='https://images.unsplash.com/photo-1592496001020-d31bd830651f?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=400&fit=max&ixid=eyJhcHBfaWQiOjE0NTg5fQ' alt=''>
                  </div>
                  <div class="card-body">
                      <p class="blog-hashtag"><i class="fas fa-calendar-alt"></i> Kamis, 19 November 2020</p></p>
                      <h2 class="blog-title">Mediation and Mental Wellness Best Practices</h2>
                      <p class="blog-description">Mediation has transformed my life. These are the best practices to get into the habit</p>
                  </div>
              </div>
                </a>
            </div>
            <!-- End Card -->
          </div>
        <!-- End Card -->
    </div>
    <!-- Akhir Content Portfolio -->

ini Code di script.js

    // JavaScript Filter Category
    filterSelection("all")
    function filterSelection(c) {
    var x, i;
    x = document.getElementsByClassName("filterDiv");
    if (c == "all") c = "";
    for (i = 0; i < x.length; i++) {
        w3RemoveClass(x[i], "show");
        if (x[i].className.indexOf(c) > -1) w3AddClass(x[i], "show");
    }
    }

    function w3AddClass(element, name) {
    var i, arr1, arr2;
    arr1 = element.className.split(" ");
    arr2 = name.split(" ");
    for (i = 0; i < arr2.length; i++) {
        if (arr1.indexOf(arr2[i]) == -1) {element.className += " " + arr2[i];}
    }
    }

    function w3RemoveClass(element, name) {
    var i, arr1, arr2;
    arr1 = element.className.split(" ");
    arr2 = name.split(" ");
    for (i = 0; i < arr2.length; i++) {
        while (arr1.indexOf(arr2[i]) > -1) {
        arr1.splice(arr1.indexOf(arr2[i]), 1);
        }
    }
    element.className = arr1.join(" ");
    }

    // Add active class to the current button (highlight it)
    var btnContainer = document.getElementById("myBtnContainer");
    var button = btnContainer.getElementsByClassName("btn");
    for (var i = 0; i < button.length; i++) {
    button[i].addEventListener("click", function(){
        var current = document.getElementsByClassName("active");
        current[0].className = current[0].className.replace(" active", "");
        this.className += " active";
    });
    }