title: Jquery Autocomplete _renderItem does not work when Function is called a second time
body: <p>I wanted to generate two input fields with an autocomplete that generates Icons. I used <code>_renderItem</code> but realised, that - by calling the autocomplete using a single class for multiple input fields - the second field does not call the <code>_renderItem</code> function: </p>
  
  <p>See here: </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var $project = $('.project');
  
  
  var projects = [{
      value: "jquery",
      label: "jQuery",
      desc: "the write less, do more, JavaScript library",
      icon: "jquery_32x32.png"
    },
    {
      value: "jquery-ui",
      label: "jQuery UI",
      desc: "the official user interface library for jQuery",
      icon: "jqueryui_32x32.png"
    },
    {
      value: "sizzlejs",
      label: "Sizzle JS",
      desc: "a pure-JavaScript CSS selector engine",
      icon: "sizzlejs_32x32.png"
    }
  ];
  
  $project.autocomplete({
    minLength: 0,
    source: projects,
    focus: function(event, ui) {
      this.val(ui.item.label);
      return false;
    }
  });
  
  $project.data("ui-autocomplete")._renderItem = function(ul, item) {
  
    var $li = $('&lt;li&gt;'),
      $img = $('&lt;img&gt;');
  
  
    $img.attr({
      src: 'https://jqueryui.com/resources/demos/autocomplete/images/' + item.icon,
      alt: item.label
    });
  
    $li.attr('data-value', item.label);
    $li.append('&lt;a href="#"&gt;');
    $li.find('a').append($img).append(item.label);
  
    return $li.appendTo(ul);
  };</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://code.jquery.com/jquery-1.11.0.min.js"&gt;&lt;/script&gt;
  &lt;link href="https://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.min.css" rel="stylesheet" type="text/css" /&gt;
  &lt;script src="https://code.jquery.com/ui/1.10.4/jquery-ui.min.js"&gt;&lt;/script&gt;
  
  &lt;div id="project-label"&gt;This one works:&lt;/div&gt;
  &lt;input class="project"&gt;
  &lt;br /&gt;
  &lt;br /&gt;
  &lt;br /&gt;
  &lt;br /&gt;
  
  &lt;div id="project-label"&gt;This one does not show Images in the List:&lt;/div&gt;
  &lt;input class="project"&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>How comes that in the second autocomplete Input-Field the images are not shown. How can I get it working. 
  Since in my Website I am using php to generate the fields automatically and have only one autocompletefunction overall, I am calling the autocomplete via the class. Is there another possibility? Thanks for helping. </p>