Untitled

<style>
  #search {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 2rem 0;
  }
</style>
<body>

<div id="container">
  <form id="search">
    <div>
      <label>Search <input id="query" placeholder="Query..." required></label>
      <input type="submit" value="Update Links">
      <input type="submit" id="openTabs" value="Open All Tabs">
    </div>
  </form>

  <div id="search-engine-links">
    <ul>

    </ul>
  </div>

</div>

<template id="search-engine-link-tpl">
  <li><a href="" target="_blank"></a></li>
</template>

<script>
  (function(){
    const engines = [
      {name: 'qwant', url: 'https://www.qwant.com/?q='},
      {name: 'yandex', url: 'https://yandex.com/search/?text='},
      {name: 'searx.be', url: 'https://searx.be/search?categories=general&q='},
      {name: 'search.brave.com', url: 'https://search.brave.com/search?q='},
    ];

    const searchEngineLinkTpl = document.querySelector('#search-engine-link-tpl');
    const searchForm = document.querySelector('#search');
    const queryInput = document.querySelector('#query');
    const openTabsButton = document.querySelector('#openTabs');
    const searchLinks = document.querySelector('#search-engine-links ul');

    function renderSearchLinks(searchText, openTabs) {
      searchLinks.innerHTML = '';
      engines.forEach(engine => {
        const url = engine.url + encodeURIComponent(searchText);
        const node = searchEngineLinkTpl.content.cloneNode(true);
        const a = node.querySelector('a');
        a.textContent = `${engine.name} | ${url}`;
        a.href = engine.url + encodeURIComponent(searchText);
        searchLinks.appendChild(node);

        if (openTabs) {
          a.click();
        }
      });

    }

    function update(evt) {
      evt.preventDefault();
      const autoOpenTabsButtonClicked = document.activeElement === openTabsButton;
      renderSearchLinks(queryInput.value, autoOpenTabsButtonClicked);
    }

    queryInput.addEventListener('input', update);
    searchForm.addEventListener('submit', update);

  })();
</script>

</body>