Как я могу показать результаты с несколькими выбранными значениями из раскрывающегося списка?

Question

Итак, как я могу реализовать несколько выбранных значений из раскрывающегося списка. В настоящее время javascript отображает совпадения, основанные на вводе поиска и выбранном значении из раскрывающегося списка. Он также принимает во внимание выпадающие варианты (какой магазин выбрать), но только для одного варианта. После изменения <select> на multiple он распознает только первую выбранную опцию. Как я могу сделать так, чтобы javascript мог понять, что если выбрано более одной опции, тогда для отображения соответствующих ей совпадений?

HTML

<select class="custom-select" multiple="multiple">
    <option value="" selected>All Shops</option>
    <option value="https://centra.">Centra</option>
    <option value="https://www.tesco.">Tesco</option>
    <option value="https://shop.supervalu.">SuperValu</option>
    <option value="https://www.lidl.">Lidl</option>
    <option value="https://www.aldi.">Aldi</option>
</select>

Javascript

function findMatches(wordToMatch, searchUrl, name) {
    const regEx = new RegExp(wordToMatch, 'gi');
    return name.filter(place => {
        return regEx.test(place.name) && place.url.startsWith(searchUrl);
    });
}



function displayMatches() {
const searchText = document.querySelector('.search').value;

const searchUrl = document.querySelector('.custom-select').value;

const matchArray = findMatches(searchText, searchUrl, name);


  const html = matchArray.map(place => {
    const regex = new RegExp(searchText);
    const nameName = place.name.replace(regex, `<span class="hl">${searchText}</span>`);
         var shop = place.url.replace(/(centra)|[^]/g, '$1').replace(/^\w/, c => c.toUpperCase());
         var shop1 = place.url.replace(/(tesco)|[^]/g, '$1').replace(/^\w/, c => c.toUpperCase());
         var shop2 = place.url.replace(/(aldi)|[^]/g, '$1').replace(/^\w/, c => c.toUpperCase());
         var shop3 = place.url.replace(/(lidl)|[^]/g, '$1').replace(/^\w/, c => c.toUpperCase());
         var shop4 = place.url.replace(/(supervalu)|[^]/g, '$1').replace(/^\w/, c => c.toUpperCase());
    return `
        <a href="${place.url}" target="_blank">
            <li>
                <span class="name">${nameName} <br> ${(place.price)} <br><br><sup>${shop} ${shop1} ${shop2} ${shop3} ${shop4}</sup></span>
                <img src="${place.imgurl}" alt="Drink Image" height="87.5" width="100">

            </li>
        </a>

    `;
  }).join('') || '<li> No Searches Found </li>';
  suggestions.innerHTML = html; 
};