Isotope- Have an already selected category instead of showing all on loading website

I am writing a code in which I want to filter different categories using isotope in html website using js. I have written the code for filtering and it works fine. When I load the website then all the images are shown. I want to have a particular category selected at the start.

code-

window.addEventListener('load', () => {
    let portfolioContainer = select('.portfolio-container');
    if (portfolioContainer) {
      let portfolioIsotope = new Isotope(portfolioContainer, {
        itemSelector: '.portfolio-item'
      });

      let portfolioFilters = select('#portfolio-flters li', true);

      on('click', '#portfolio-flters li', function(e) {
        e.preventDefault();
        portfolioFilters.forEach(function(el) {
          el.classList.remove('filter-active');
        });
        this.classList.add('filter-active');

        portfolioIsotope.arrange({
          filter: this.getAttribute('data-filter')
        });
        portfolioIsotope.on('arrangeComplete', function() {
          AOS.refresh()
        });
      }, true);
    }

  });

html code-

 <li data-filter=".filter-cof">Clip On Frame</li>
      <li data-filter=".filter-ib">Inshop Branding</li>
      <li data-filter=".filter-pf">Photo Frame</li>