Dropdown mit Mehrfachauswahl und Ergebnisliste

Ich möchte eine Dropdown-Liste erstellen, wo Mehrfachauswahl möglich ist (am Besten in Form von Kontrollkästchen). Die dort getroffene Auswahl soll dann eine dahinterliegende Liste "filtern" und Ergebnisse anhand der Auswahl ausspucken. In meinem Fall, um es etwas plastischer zu machen, möchte ich eine Liste von Orten zur Verfügung stellen, aus welchen eine frei wählbare Menge ausgewählt werden kann (geil wär auch die Möglichkeit "alle" einfach und schnell auszuwählen).
Kommentar abgeben zu diesen Beitrag/Code ?
Dann hier klicken

Der hier verwendete Code

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
ul,li { margin:0; padding:0; list-style:none;}
.label { color:#000; font-size:16px;}
.ms-options-wrap,
.ms-options-wrap * {
box-sizing: border-box;
}
.ms-options-wrap > button:focus,
.ms-options-wrap > button {
position: relative;
width: 100%;
text-align: left;
border: 1px solid #aaa;
background-color: #fff;
padding: 5px 20px 5px 5px;
margin-top: 1px;
font-size: 13px;
color: #aaa;
outline: none;
white-space: nowrap;
}
.ms-options-wrap > button:after {
content: ' ';
height: 0;
position: absolute;
top: 50%;
right: 5px;
width: 0;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX