具有绝对定位子问题的表格单元格

Question

我遇到以下情况的问题：

我有一个表格，其中一个单元格有一个输入字段。

<td id="myCell"><input type="text" class="myInput"></td>

所以我想要一个浮动框，显示输入字段中输入内容的一些结果。到目前为止，这一切都很好，浮动框显示结果在正确的位置，但当我点击其中一个结果时，框隐藏没有明显的原因。 结果框附有：

$("#myCell").append("<div class='searchResults'><a href='#' class='searchItem'>text</a></div>")

这是我的CSS：

.searchResults{
     z-index: 1000;
     top:30px;
     left:0px; 
     padding: 0px;
     position:absolute;           
     background-color: white;
     border: 1px solid #ccc;
     min-width: 100px;
     text-align: left;
 }

即使没有.searchResults的事件处理程序，它也会在单击时隐藏。并使用此代码处理点击事件：

$(document).on("click", ".searchItem", function(){
    alert($(this).text());
});

什么都没发生。

非常感谢任何帮助。