jQuery与自定义ul自动完成

Question

我使用的jQuery自动完成工作正常，但我需要自定义下拉列表，这是在输入框中键入内容后出现的。

自动完成代码：

bindAutoComplete:function(id,url,callback){ 

     $("#"+id).autocomplete({ 

     source: function(request, response) { 
      $.post(url, { 
      keyword: request.term 
      }, response); 
     }, 
     minLength: 3, 
     select: callback, 


     }) 
    } 

现在自动完成给这个作为输出：

<ul class="ui-autocomplete ui-front ui-menu ui-widget ui-widget-content ui-corner-all" id="ui-id-2" tabindex="0" style="display: block; top: 28px; left: 382.067px; width: 190px;"> 
    <li class="ui-menu-item" role="presentation"> 
    <a id="ui-id-18" class="ui-corner-all" tabindex="-1"> 
     Ask 1 Question 
     <br> 
    </a> 
    </li> 
    <li class="ui-menu-item" role="presentation"> 
    <a id="ui-id-19" class="ui-corner-all" tabindex="-1"> 
     Ask 2 Question 
     <br> 
    </a> 
    </li> 
    <li class="ui-menu-item" role="presentation"> 
    <a id="ui-id-20" class="ui-corner-all" tabindex="-1"> 
     Ask 3 Question 
     <br> 
    </a> 
    </li> 
    <li class="ui-menu-item" role="presentation"> 
    <a id="ui-id-21" class="ui-corner-all" tabindex="-1"> 
    Ask 4 Question 
     <br> 
    </a> 
    </li> 
    <li class="ui-menu-item" role="presentation"> 
    <a id="ui-id-22" class="ui-corner-all" tabindex="-1"> 
     Ask 5 Question 
     <br> 
    </a> 
    </li> 
</ul> 

但我想上面的输出转换到下面的HTML。

<div class="searchPOP"> 
    <ul> 
     <li><a href="#">Ask 1 Question</a></li> 
     <li><a href="#">Ask 2 Question</a></li> 
     <li><a href="#">Ask 3 Question</a></li> 
     <li><a href="#">Ask 4 Question</a></li> 
    </ul> 
</div> 

请让我知道如何做到这一点？

Answer 1

如果你能提供一个JSFiddle，那会很好。