Javascript 链接在上不起作用<；李>；点击事件

我正在用Javascript创建一个search+下拉列表，由于某种原因，当单击

元素时，它不会像预期的那样触发链接。回到我在codepen上发现的示例后，它也有相同的问题：

我使用一些过滤逻辑和

jQuery.append（）

将列表项添加为链接

我将非常感谢任何帮助！我还尝试使用

onclick（）

事件，但没有成功

下面是我的一些代码：

//搜索栏过滤器逻辑
函数searchPlayers（）{
var输入、滤波器、ul、li、a、i；
输入=document.getElementById（“searchBarInput”）；
filter=input.value.toUpperCase（）；
div=document.getElementById（“dropdownItems”）；
li=div.getElementsByTagName（“li”）；
//删除所有当前项目
对于（i=li.length-1；i>-1；i--）{
removeChild分部（李[i]）；
}
//检查最小长度
如果（过滤器长度<3）{
$（“#dropdownItems”）。追加（“
”）；
}
}  
//搜索栏焦点丢失
$（文档）.on（“focusout”，“searchBarInput输入”，函数（）{
var div=document.getElementById（“dropdownItems”）；
var li=div.getElementsByTagName（“li”）；
//删除所有当前项目
对于（i=li.length-1；i>-1；i--）{
removeChild分部（李[i]）；
}
});
/**版权所有（c）2012 Thibaut Courouble
*根据麻省理工学院许可证获得许可
================================================== */
a{
颜色：1e7ad3；
文字装饰：无；
字体大小：12px；
}
a:悬停{文本装饰：下划线}
输入{
字体大小：13px；
颜色：#555860；
}
.搜索{
位置：相对位置；
保证金：0自动；
}
.搜索输入{
高度：26px；
宽度：100%；
填充：0 12px 0 25px；
背景：白色url（“https://cssdeck.com/uploads/media/items/5/5JuDgOa.png）8px 6px无重复；
边框宽度：1px；
边框样式：实心；
边框颜色：a8acbc#babdcc#c0c3d2；
边界半径：13px；
-webkit框大小：边框框；
-moz框大小：边框框；
-ms框尺寸：边框框；
-o型盒尺寸：边框盒；
框大小：边框框；
-网络工具包盒阴影：插入0 1px#e5e7ed，0 1px 0#fcfc；
-moz盒阴影：插入0 1px#e5e7ed，0 1px 0#fcfc；
-ms盒阴影：插入0 1px#e5e7ed，0 1px 0#fcfc；
-o形盒阴影：嵌入0 1px#e5e7ed，0 1px 0#fcfc；
盒影：插入0 1px#e5e7ed，0 1px 0#fcfc；
}
.搜索输入：焦点{
大纲：无；
边框颜色：#66b1ee；
-webkit盒阴影：0.02×rgba（85,168,236,0.9）；
-moz盒阴影：0.02×rgba（85,168,236,0.9）；
-ms盒影：0.02×rgba（85、168、236、0.9）；
-o形盒阴影：0.02×rgba（85,168,236,0.9）；
盒影：0.02×rgba（85,168,236,0.9）；
}
.search输入：focus+.results{display:block}
.搜索.结果{
显示：无；
位置：绝对位置；
顶部：35px；
左：0；
右：0；
z指数：10；
填充：0；
保证金：0；
边框宽度：1px；
边框样式：实心；
边框颜色：#cbcfe2#c8cee7#c4c7d7；
边界半径：3px；
背景色：#fdfd；
背景图像：-webkit渐变（线性、左上、左下、颜色停止（0%、#fdfdfd）、颜色停止（100%、#eceef4））；
背景图像：-webkit线性渐变（顶部，#fdfdfd，#eceef4）；
背景图像：-莫兹线性梯度（顶部，#fdfdfd，#eceef4）；
背景图像：-ms线性梯度（顶部，#fdfdfd，#eceef4）；
背景图像：-o-线性梯度（顶部，#fdfdfd，#eceef4）；
背景图像：线性渐变（顶部，#fdfdfd，#eceef4）；
-webkit盒阴影：0 1px2pRGBA（0,0,0,0.1）；
-moz盒阴影：0 1px2pRGBA（0,0,0,0.1）；
-ms盒阴影：0 1px2pRGBA（0,0,0,0.1）；
-o盒阴影：0 1px2pRGBA（0,0,0,0.1）；
盒影：0 1px2pRGBA（0,0,0,0.1）；
}
.search.results li{
显示：块；
}
.search.results li:first child{margin top:-1px}
.search.results li:第一个孩子：之前，.search.results li:第一个孩子：之后{
显示：块；
内容：''；
宽度：0；
身高：0；
位置：绝对位置；
左：50%；
左边距：-5px；
边框：5px透明；
}
.search.results li:第一个孩子：之前{
边框底部：5px实心#c4c7d7；
顶部：-11px；
}
.search.results li:第一个孩子：之后{
边框底部：5px实心#fdfdfd；
顶部：-10px；
}
.search.results li:first child:hover:before.search.results li:first child:hover:after{display:none}
.search.results li:最后一个子项{margin bottom:-1px}
.search.results a{
显示：块；
位置：相对位置；
保证金：0-1px；
填充：6px 40px 6px 10px；
颜色：#808394；
文字颜色：#808394；
字号：500；
文本阴影：0 1px#fff；
边框：1px实心透明；
边界半径：3px；
}
.search.results一个span{font-weight:200}
.搜索结果a:之前{
内容：''；
宽度：18px；
高度：18px；
位置：绝对位置；
最高：50%；
右：10px；
利润上限：-9px；
背景：url（“https://cssdeck.com/uploads/media/items/7/7BNkBjd.png）0不重复；
}
.search.results a:悬停{
文字装饰：无；
颜色：#fff；
文本阴影：0-1pxRGBA（0,0,0,0.3）；
边框颜色：2380dd#2179d5#1a60aa；
背景色：#338cdf；
背景图像：-webkit渐变（线性、左上、左下、颜色停止（0%、#59aaf4）、颜色停止（100%、#338cdf））；
背景图像：-webkit线性渐变（顶部，#59aaf4，#338cdf）；
背景图像：-moz线性梯度（顶部，#59aaf4，#338cdf）；
背景图像：-ms线性梯度（顶部，#59aaf4，#338cdf）；
背景图像：-o-线性梯度（顶部，#59aaf4，#338cdf）；
背景图像：线性渐变（顶部，#59aaf4，#338cdf）；
-webkit盒阴影：插入0 1px rgba（255,255,255,0.2），0 1px rgba（0,0,0,0.08）；
-moz盒阴影：插入0 1px rgba（255,255,255,0.2），0 1px rgba（0,0,0,0.08）；
-ms盒阴影：插入0 1px rgba（255,255,255,0.2），0 1px rgba（0,0,0,0.08）；
-o-box-sha
.search input:focus + .results,
.search .results:hover { display: block }