Не происходит добавление элемента в multiselect. [требует правки]

$(".filterDropdown dt a").on('click', function() { 
  $(".filterDropdown dd ul").slideToggle('fast'); 
}); 
 
$(".filterDropdown dd ul li a").on('click', function() { 
  $(".filterDropdown dd ul").hide(); 
}); 
 
function getSelectedValue(id) { 
  return $("#" + id).find("dt a span.value").html(); 
} 
 
$(document).bind('click', function(e) { 
  var $clicked = $(e.target); 
  if (!$clicked.parents().hasClass("filterDropdown")) $(".filterDropdown dd ul").hide(); 
}); 
 
$('.mutliselect input[type="checkbox"]').on('click', function() { 
 
  var title = $(this).closest('.mutliselect').find('input[type="checkbox"]').val(), 
    title = $(this).val() + ","; 
 
  if ($(this).is(':checked')) { 
    var html = '<span title="' + title + '">' + title + '</span>'; 
    $('.resultSelect').append(html); 
    $(".resultFilter").hide(); 
  } else { 
    $('span[title="' + title + '"]').remove(); 
    var ret = $(".resultFilter"); 
    $('.filterDropdown dt a').append(ret); 
 
  } 
});

.filters { 
	width: 270px; 
	height: 100%; 
	background-color:#fff; 
	border-right: 1px solid #f7f7f7; 
	position: relative; 
} 
 
.filterDropdown { 
	position: absolute; 
	top:30px; 
	left: 80px;	 
	transform: translate(-50%); 
} 
 
.filterDropdown a { 
	color:#5795f9; 
} 
 
.filterDropdown dd, 
.filterDropdown dt { 
	margin: 0px; 
	padding: 0px; 
} 
 
.filterDropdown ul { 
	margin: -1px 0 0 0; 
} 
 
.filterDropdown dd { 
	position: relative; 
} 
 
.filterDropdown a, 
.filterDropdown a:visited { 
	color: #5795f9; 
	text-decoration: none; 
	outline: none; 
	font-size: 12px; 
} 
 
.filterDropdown dt a { 
	background-color: #fff; 
	display: block; 
	padding: 8px 20px 5px 10px; 
	min-height: 15px; 
	line-height: 24px; 
	overflow: hidden; 
	border: 0; 
	width: 152px; 
	border:1px solid black; 
} 
 
 
 
.filterDropdown dt a span, 
.resultSelect span { 
	cursor: pointer; 
	display: inline-block; 
	color: #000; 
	padding: 0 6px 2px 0; 
} 
 
.filterDropdown dd ul { 
	background-color: #fff; 
	border: 0; 
	color: #5795f9; 
	display: none; 
	left: 0px; 
	padding: 2px 15px 2px 5px; 
	position: absolute; 
	top: 2px; 
	width: 180px; 
	border:1px solid black; 
	list-style: none; 
	height: 100px; 
	overflow: auto; 
} 
 
.filterDropdown span.value { 
	display: none; 
} 
 
.filterDropdown dd ul li a { 
	padding: 5px; 
	display: block; 
} 
 
.filterDropdown dd ul li a:hover { 
	background-color: #5795f9; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<dl class = "filterDropdown"> 
				<dt> 
					<a href="#"> 
						<span class = "resultFilter"></span> 
						<span class = "resultFilterNew"></span> 
						<p class = "resultSelect"></p> 
					</a> 
 
					 
 
				</dt> 
 
				<dd> 
					<div class = "multiselect"> 
						<ul> 
 
							<li><input type="checkbox" value="Kyiv">Kyiv</li> 
							<li><input type="checkbox" value="Kharkiv">Kharkiv</li> 
							<li><input type="checkbox" value="Lviv">Lviv</li> 
 
						</ul> 
					</div> 
				</dd> 
 
			</dl>