Ich habe eine JSON-Zeichenfolge (von PHP json_encode), die aussieht wie;

var json = [{"Foo":[{"id":1,"name":"aaa"},{"id":2,"name":"bbb"}]},{"Bar":[{"id":3,"name":"ccc"},{"id":4,"name":"ddd"}]}];

Ich möchte in der Lage sein, eine HTML-Auswahl mit Javascript / jQuery im Formular zu erstellen.

<select>
    <optgroup label="Foo">
        <option value="1">aaa</option>
        <option value="2">bbb</option>
    </optgroup>
    <optgroup label="Bar">
        <option value="3">ccc</option>
        <option value="4">ddd</option>
    </optgroup>
</select>

In Bezug auf die Verarbeitung der JSON bekomme ichso weit (nicht weit ich weiß), aber jsFiddle kann es nicht ausführen und friert meinen Browser ein.

var json = [{"Foo":[{"id":1,"name":"aaa"},{"id":2,"name":"bbb"}]},{"Bar":[{"id":3,"name":"ccc"},{"id":4,"name":"ddd"}]}];

$.each(json, function(i,group) {
    console.log(i);
    $.each(group, function(j, option) {
        console.log(j, option);
        $.each(option, function(k, item) {
            console.log(k, item);
        });
    });
});​