ajax e sostituzione <div>

[Keown]

Salve a tutti!

Sto cercando di scrivere una funzione js che mi permetta di sostituire il contenuto di un tag <div> (con un attributo id) all'interno di una pagina hmtl.
Sembrerebbe una cosa banale ma mi sono inceppato...

function update(dom)
{
    var target = document.getElementById("mainArea");

    if (target == null)
    {
        alert("ERRORE! ID NON PRESENTE");
        return;
    }

    target.innerHTML = serializeXml(dom);

} 

La funzione prende come argomento un XMLDocument, che ho caricato in precedenza dentro una variabile. In questo modo sembra funzionare correttamente ma, ovviamente, il contenunto del <div id="pippo"></div> non viene sostituito con quello del <div> interno all'xml ma si crea una situazione del genere:

<div id="mainArea">
<div id="mainArea">
//...contenuto...
</div>
</div>

In pratica sostituisce il contenuto del div nella pagina con tutto il contenuto dell'xml.

Ho provato allora a cambiare la funzione in questo modo:

function update(dom)
{
     var source = dom.getElementById("mainArea");       
     var target = document.getElementById("mainArea");

    if (target == null)
    {
        alert("ERRORE! ID NON PRESENTE");
        return;
    }

    target.innerHTML = serializeXml(source);

} 

Ma ottengo un errore.
A naso mi sembra che quando tento di selezionare il contenuto del div (dom.getElementById("mainArea") qualcosa vada storto e la selezione non venga effettuata. Infatti se aggiungo un alert(source) ottengo come risposta un bell "null".

Qualcuno con un po' di pazienza saprebbe darmi qualche hint?

Grazie 1000 e scusate la (probabile) banalità della domanda!