Как выводить несколько значений подряд при клике?

Есть селект, при клике выводится значение, подскажите как вывести множество значений как на на картинке: https://i.stack.imgur.com/GBdV0.png. И при клике на значение что-бы оно могло удаляться? Спасибо

function selectServer() {
    const optionMenusTypes = document.querySelectorAll('.types-select__menu');

    optionMenusTypes.forEach(optionMenuType => {
        const selectBtnType = optionMenuType.querySelector('.types-select__btn');
        const optionsType = optionMenuType.querySelectorAll('.types-select__option');
        const sBtntextType = optionMenuType.querySelector('.types-select__btntext');

        if (optionMenuType) {
            selectBtnType.addEventListener("click", function (e) {
                let elem_active = optionMenuType.classList.contains("_active")
                optionMenusTypes.forEach(opt => {
                    opt.classList.remove('_active');
                })
                optionMenuType.classList.toggle("_active", !elem_active)
            });

            optionsType.forEach(option => {
                option.addEventListener("click", function (e) {
                    if (e.target.classList.contains('.types-select__option-text') != null) {
                        const selectedOption = option.querySelector('.types-select__option-text').innerText;
                        sBtntextType.innerText = selectedOption;
                    };
                    optionsType.forEach(el => { el.classList.remove('_active'); });
                    option.classList.add("_active");
                    optionMenuType.classList.remove("_active")
                });
            });
            window.addEventListener('click', e => {
                const target = e.target
                if (!target.closest('.types-select__options') && !target.closest('.types-select__menu')) {
                    optionMenuType.classList.remove("_active")
                }
            })

        }
    })
}

selectServer()
.types-select {
  position: relative;
}

.types-select__menu._active .types-select__icon {
  transform: rotate(-180deg);
}

.types-select__menu._active .types-select__body {
  display: block;
}

.types-select__menu._active .types-select__options {
  opacity: 1;
  pointer-events: auto;
}

.types-select__menu._active .types-select__btn {
  z-index: 7;
}

.types-select__btn {
  display: flex;
  align-items: center;
  height: 53px;
  background: #ffffff;
  position: relative;
  border: 1px solid #e1e1eb;
  border-radius: 10px;
  padding: 12px 45px 12px 20px;
}

.types-select__input {
  font-weight: 450;
  color: #191919;
  font-size: 16px;
  background: #ffffff;
  line-height: 1.1;
}

.types-select__icon {
  cursor: pointer;
  position: absolute;
  top: 23px;
  right: 25px;
  transition: all 0.3s ease 0s;
}

.types-select__icon::before {
  font-size: 7px;
  color: #f5912d;
}

.types-select__body {
  outline: none;
  display: none;
  position: absolute;
  top: 54px;
  left: 0;
  width: 100%;
  z-index: 5;
}

.types-select__options {
  height: 360px;
  background: #ffffff;
  filter: drop-shadow(0px 20px 40px rgba(25, 25, 25, 0.15));
  border-radius: 10px;
  overflow: auto;
  pointer-events: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.types-select__options::-webkit-scrollbar {
  display: none;
}

.types-select__option {
  cursor: pointer;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.1;
  padding: 16px 20px;
  transition: all 0.3s ease 0s;
  display: block;
  border-bottom: 1px solid #f0f0f0;
}

.types-select__option:last-child {
  border-bottom: none;
}

.types-select__option:hover {
  background: #f8f8fa;
}

.types-select__option-text {
  display: flex;
  align-items: center;
}

.types-select__option-text span {
  color: #f5912d;
}
<div class="left-form-calculator__select select types-select">
  <div class="types-select__menu">
    <div class="types-select__btn">
      <div class="types-select__btntext">

      </div>
      <div class="types-select__icon _icon-arrow"></div>
    </div>
    <div class="types-select__body">
      <ul class="types-select__options">
        <li class="types-select__option">
          <div class="types-select__option-text">Офисная&nbsp;<span>меб</span>ель</div>
        </li>
        <li class="types-select__option">
          <div class="types-select__option-text">Техника / сантехника</div>
        </li>
        <li class="types-select__option">
          <div class="types-select__option-text">Сборка кухни</div>
        </li>
      </ul>
    </div>
  </div>
</div>


Ответы (0 шт):