select.append adds the option but dropdown is still empty
<p>I am populating dropdown using jquery ajax call.</p>

<pre><code> $.ajax({
            type: "POST",
            url: "Appointment.aspx/BindAssociates",
            data: "{storeNumber:" + StoreNum + "}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(result){
                var rs = result.d;
                var selectAdd = $("#MST_CPH_AddAppointment_ddlAptAssociateName");
                var selectView = $("#MST_CPH_ViewAppointments_ddlViewAptAssociateName");

                for (var i = 0; i &lt; rs.length; i++) {
                    var opt = rs[i].trim().toUpperCase();
                    //var optView = rs[i].trim();
                    selectAdd.append(new Option(opt,opt));
                    selectView.append(new Option(opt,opt));

                }
            },
            error: function(result){
                alert("Failed to load dropdown" + result);
            }
        });
</code></pre>

<p>When i debug I can see that success method is executed. but dropdowns still show empty on UI. I am using jquery 1.11.3 and IE8. (Don't ask me why as its the organization requirement). Please help me with this.</p>