jQuery UI, HTML in autocomplete -

i'm trying exact same thing in: http://dev.nemikor.com/jquery-ui-extensions/autocomplete/html.html

but it's not working, label , value showed in autocomplete, ie when i'm inputting "a": "aardvark", "< b>apple" , "< i>atom" displayed in box below input.

my html is:

<form>     <input type="text" id="recherche" /> </form> 

my jquery is:

      $('#recherche').autocomplete({         source: [             {                 label: "aardvark",                  value: "aardvark"             },             {                 label: "<b>apple</b>",                 value: "apple"             },             {                 label: "<i>atom</i>",                 value: "atom"             }         ],         html: true     }); 

and i'm using jquery ui 1.11.4

it seems you've missed jquery.ui.autocomplete.html.js source you've give in question has used it.

here i've created jsfiddle

markup:

<form>     <input id="recherche" /> </form> 

javascript code:

(function( $ ) {  var proto = $.ui.autocomplete.prototype,     initsource = proto._initsource;  function filter( array, term ) {     var matcher = new regexp( $.ui.autocomplete.escaperegex(term), "i" );     return $.grep( array, function(value) {         return matcher.test( $( "<div>" ).html( value.label || value.value || value ).text() );     }); }  $.extend( proto, {     _initsource: function() {         if ( this.options.html && $.isarray(this.options.source) ) {             this.source = function( request, response ) {                 response( filter( this.options.source, request.term ) );             };         } else {             initsource.call( );         }     },      _renderitem: function( ul, item) {         return $( "<li></li>" )             .data( "item.autocomplete", item )             .append( $( "<a></a>" )[ this.options.html ? "html" : "text" ]( item.label ) )             .appendto( ul );     } });  })( jquery );  $('#recherche').autocomplete({         source: [             {                 label: "aardvark",                  value: "aardvark"             },             {                 label: "<b>apple</b>",                 value: "apple"             },             {                 label: "<i>atom</i>",                 value: "atom"             }         ],         html: true     }); 

using jquery.ui.autocomplete js , working fine.

please have look, trick you.