ciao Kendom
mi sa che puoi risolvere solo ricorrendo ad un uso massiccio degli strumenti messi a disposizione dal DOM moderno
nell' esempio che hai postato invece procedi in maniera mista:
crei l' elemento (option) con createElement, per poi appenderlo alla select in maniera "classica"

x capirci, in maniera classica potresti scrivere direttamente
obj.options[obj.length] = new Option('testo option','valore option')

ma puoi farlo perchè l' oggetto option ha nativamente un suo costruttore
mentre un optgroup non ce l' ha

un esempio veloce con i metodi del DOM moderno (il cui supporto da parte del browser in uso andrebbe cmq testato)
codice:
function aggiungi(lettera,nome){
	var gruppo=document.createElement('optgroup');
	gruppo.setAttribute('label','lettera '+lettera);
	var opzione=document.createElement('option');
	var testo=document.createTextNode(nome);
	opzione.appendChild(testo);
	// opzione.setAttribute('value','eventuale_valore_option');
	gruppo.appendChild(opzione);
	document.DATI.mioselect.appendChild(gruppo);
}
...
<input type="button" value='aggiungi c' onclick="aggiungi('C','Carolina')" />
<input type="button" value='aggiungi d' onclick="aggiungi('D','Daniele')" />
x altre operazioni puoi usare i metodi discussi in questa pagina
cmq prima di procedere è consigliabile un approfondimento a tutto il DOM moderno