title: Not able to select the values of jQuery Autocomplete?
body: <p>I am trying and experimenting to create a customized jQuery UI Autocomplete but I am failing in the first step itself. When I click on the values that populate there is no response. I am not able to select the values of autocomplete. Can anyone please let me know why?</p>
  
  <p>Below is my code:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;script src="http://code.jquery.com/jquery-1.11.0.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://code.jquery.com/ui/1.10.4/jquery-ui.min.js"&gt;&lt;/script&gt;
    &lt;title&gt;test&lt;/title&gt;
  &lt;body&gt;
    &lt;div&gt;Select:&lt;/div&gt;
    &lt;input id="project" style="width:380px;"&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>(function($){
  
    var $project = $('#project');
  
    var projects = [
      {
        value: "test1",
        label: "test1",
        desc: "test1",
        icon: "jquery_32x32.png"
      },
      {
        value: "test2",
        label: "test2",
        desc: "test2",
        icon: "jqueryui_32x32.png"
      }
    ];
  
    $project.autocomplete({
      minLength: 0,
      source: projects,
      focus: function( event, ui ) {
        $project.val(ui.item.value);
        return false;
      }
    }).data( "ui-autocomplete" )._renderItem = function( ul, item ) {
      var inner_html = '&lt;table&gt;&lt;tr&gt;&lt;td&gt;' + item.value + '&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;';
  return $("&lt;li&gt;&lt;/li&gt;")
                                  .data("item.autocomplete", item)
                                  .append(inner_html)
                                  .appendTo(ul);
    };
  
  
  })(jQuery);
  </code></pre>