jQuery with ASP.NET - How to Create, Populate, and Show UL
<p>In an ASP.NET web app, I am trying to create and populate a UL based on user input.  This is not a quick fill.  User enters a couple of letters, clicks a button, and the server returns all records like the entry.  If there is more than one match, an UL is created showing all of the matches.   </p>

<p>I've tried to adapt this code from a plugin. I can step through it with the debugger and everything seems OK, but the UL is either not generated to the document or it is invisible.</p>

<p>Here is the simplified code:</p>

<pre><code>function fillBusinessDropdown(ListOfBusinesses) {

 var results = document.createElement("div");
 var $results = $(results);
 $results.hide().addClass("ac_results").css("position", "absolute");

 if ($.browser.msie) {
    $results.append(document.createElement('iframe'));
 }

 results.appendChild(businessToDom(ListOfBusinesses));

 $results.css({
 width: 400 + "px",
 top: 100 + "px",
 left: 150 + "px"
 }).show();


function businessToDom(ListOfBusinesses) {

  var ul = document.createElement("ul");

  var iLen = ListOfBusinesses.length - 1

  for (var i = 0; i &lt;= iLen; i++) {
    var row = ListOfBusinesses[i];
    if (!row) continue;
       var li = document.createElement("li");

    // add the business name

    li.innerHTML = row.Bu_name;

// add the business ID
li.selectValue = row.Bupk;
var extra = null;
if (row.length &gt; 1) {
  extra = [];
  for (var j = 1; j &lt; row.length; j++) {
    extra[extra.length] = row[j];
  }
}
li.extra = extra;
ul.appendChild(li);

$(li).hover(
 function() { $("li", ul).removeClass("ac_over");      
            $(this).addClass("ac_over"); active = $("li", ul).indexOf($(this).get(0)); },
   function() { $(this).removeClass("ac_over"); }
 ).click(function(e) { e.preventDefault(); e.stopPropagation();   selectItem(this) });
  }
  return ul;
}
</code></pre>

<p>I am stumped.  Does any0oe have any  ideas where  I've gone wrong?
Thanks
Mike Thomas</p>
