This jQuery Ui Autocomplete code with image works perfectly well, but the image appears on top of the text, I would like the image to appear on the left and text on the right, like the photo below. Any suggestions?
$(function() {
var cache = {};
$("#myAutocomplete").autocomplete({
minLength: 1,
source: function(request, response) {
var term = request.term;
if (term in cache) {
response(cache[term]);
return;
}
$.getJSON("services/test_ima_JAutocomplete1.asp", request, function(data, status, xhr) {
status, xhr ) {
cache[term] = data;
response(data);
});
}
}).data("ui-autocomplete")._renderItem = function (ul, item) {
return $("<li></li>")
.data("item.autocomplete", item)
.append("<img src="+ item.image + ">" + "<a>" + item.label + "</a>" )
.appendTo(ul);
}
});