JQueryUI Autocomplete Select Event not working

Question

I am using JQuery 1.4.2 and JQueryUI 1.8.5. I know this problem doesn't exist in the latest version but we cannot change the JQuery & UI version.

I am trying to display the AutoComplete items in 2 lines.
1st line - Name and 2nd line - Address

It shows as I want in 2 lines, but when I select the item, it shows, ui.item is null error.

The code is as follow:

$('#txtPractice').autocomplete({
         source: function (request, response) {
             $.ajax({
                 url: '/MyWebService.asmx/GetDataFromFreeText',
                 data: "{ 'name': '" + request.term + "'}",
                 dataType: "json",
                 type: "POST",
                 contentType: "application/json; charset=utf-8",
                 dataFilter: function (data) { return data; },
                 success: function (data) {
                     response($.map(data.d, function (item) {
                         return {
                             value: item.name,
                             id: item.id,
                             desc: item.address1
                         }
                     }))
                 },
             });
         },
         delay: 0,
         minLength: 2,
         select: function (event, ui) {
             $('#hdPracticeID').val(ui.item.id);
         }
     })
     .data("autocomplete")._renderItem = function (ul, item) {
         return $("<li>")
    .append("<a>" + item.value + "<br>" + item.desc + "</a>")
    .appendTo(ul);
     };
 }

If I remove the feature for rendering 2 lines, .data("autocomplete").... , it's working fine and the item can be selected, but I get only 1 line. If I put, when the item is selected, ui.item is null error shows. I couldn't find the way to meet both of my requirements.

Could you please help me to suggest the best solution? Thanks.