Escape HTML “value” attribute for a select menu

Question

I have a select menu and I dynamically insert some values from a database:

 markup += '<option value=' + option["value"] + '>' + option["alias"] + '</option>';

some values, however, contain double quotes. to try and get around this I tried:

markup += '<option value=' + JSON.stringify(option["value"]) + '>' + option["alias"] + '</option>';

For examples sake lets assume the value is 6"Rocket (this is actually my problem child) When I try and read the value using Jquery .val() I always get 6.

What to do SO?

Answer 1

The simplest way of avoiding this problem is to DOM-sript rather than insert strings of HTML.

var sel = $('#some_dropdown');
...
$('<option />', {value: option.value, text: option.alias}).appendTo(sel);