set option “selected” attribute from dynamic created option

Question

I have a dynamically created select option using a javascript function. the select object is

<         


        

Answer 1

Good question. You will need to modify the HTML itself rather than rely on DOM properties.

var opt = $("option[val=ID]"),
    html = $("
").append(opt.clone()).html();
html = html.replace(/\>/, ' selected="selected">');
opt.replaceWith(html);

The code grabs the option element for Indonesia, clones it and puts it into a new div (not in the document) to retrieve the full HTML string: Indonesia.

It then does a string replace to add the attribute selected="selected" as a string, before replacing the original option with this new one.

I tested it on IE7. See it with the reset button working properly here: http://jsfiddle.net/XmW49/