jQuery select box populate issue with IE

Question

I am new to jQuery and i came across a select box population code which work perfectly in Firefox,chrome, opera but not in IE. In this code the first select will be populate the directory structure and as user select the select box the second select box should be populated according to users choice. But in IE the second select box is not populated.

the following is the sample code,

function fm_getFiles(selector) {
    if (typeof selector !== 'string') selector = 'select[name="selected_file"]';
    var fname = $(selector).attr('value');
    if (fname == '' || /\/$/.test(fname)) {
        $.getJSON('file_manager.php?f=' + fname, function (vals) {
            vals.selector = selector;
            fm_updateValues(vals);
        });
    }
    else fm_changeOptions();
}

function fm_updateValues(vals) {
    var selector = (typeof vals.selector == 'string') ? vals.selector : 'select[name="selected_file"]';
    $(selector).html(vals.options).attr('selectedIndex', vals.selectedIndex);
    if (!$(selector).hasClass('noactions')) fm_changeOptions();
}

function fm_runAction() {
    $('#selected_file_extras').empty();
    switch ($('#selected_file_options').attr('value')) {
    case 'new sub-directory':
        fm_addSubdirectory();
        break;
    case 'rename directory':
    case 'rename file':
        fm_renameDirectory();
        break;
    case 'delete directory':
    case 'delete file':
        fm_deleteDirectory();
        break;
    case 'move directory to':
    case 'move file to':
        fm_moveDirectorySetup();
        break;
    case 'upload file':
        fm_uploadFileSetup();
        break;
    }
}

function fm_changeOptions() {
    var html = '<option> -- </option>';
    var val = $('select[name="selected_file"]').attr('value');
    var is_dir = /\/$/.test(val);
    if (is_dir) {
        html += '<option>new sub-directory</option>' + '<option>upload file</option>';
        if (val != '/') {
            html += '<option>rename directory</option>' + '<option>delete directory</option>' + '<option>move directory to</option>';
        }
    } else {
        html += '<option>rename file</option>' + '<option>delete file</option>' + '<option>move file to</option>';
    }
    $('#selected_file_options').html(html);
    $('#selected_file_extras').empty();
}

$(document).ready(function () {
    fm_getFiles();
    $('select[name="selected_file"]').change(function () {
        fm_getFiles();
    });
    $('<select id="selected_file_options"></select>').insertAfter($('select[name="selected_file"]'));
    $('#selected_file_options').change(function () {
        fm_runAction();
    });
    $('<span id="selected_file_extras"></span>').insertAfter($('#selected_file_options'));
});

I debug the code using IE8 developer tool and found that selected_file_options select box is not created before fm_changeOptions() function.Any idea of how to solve this issue and why this unusual behavior?