Jquery append <select> not working in IE7, but works in firefox

Question

I am getting data from a database through AJAX and appending tags to a select statement. The following code works in firefox, but only partially in IE. The problem in IE is that is creates the option elements in the dropdown, but the "text" attribute value is empty (the dropdown appears with 30 blank rows! However, the "value" attribute value gets set correctly (which is hte primary key from my database). Is there a different field I need to set in IE other than "text"? The bolded text in teh code below is where I think the problem lies. BTW, value is not empty, and i have tried putting in a string literal in its place and it is still blank in IE.

The code is:

$.each(data, function(key,value){
    $("<option>").attr("value", key).attr("text",value).appendTo("#select1");
});

Solution

I would try to use .text() instead:

  $.each(data, 
       function(key,value){ 
           $("option").attr("value", key)
                .text(value)
                .appendTo("#select1"); 
        });

I think this is what you are going for?