Probleme texte dans alert()

Bonjour,

alors voila mon souci, j'ai une page avec plusieurs boutons de type :

<button id="bouton" onclick="showDialog()"> Voir </button>

j'ai voulu personnaliser la boite d'alert en lui ajoutant une en-tête, un pied de page, bref, j'ai donc fait ceci :

<div id="white-background">
</div>
<div id="dlgbox">
    <div id="dlg-header">mon titre</div>
    <div id="dlg-body">mon texte</div>
    <div id="dlg-footer">
        <button onclick="dlgOK()">OK</button>
    </div>
</div>

sans oublier le javascript :

    function dlgCancel(){
        dlgHide();
        document.getElementsByTagName("H1")[0].innerHTML = "You clicked Cancel.";
    }
    function dlgOK(){
        dlgHide();
        document.getElementsByTagName("H1")[0].innerHTML = "You clicked OK.";
    }
    function dlgHide(){
        var whitebg = document.getElementById("white-background");
        var dlg = document.getElementById("dlgbox");
        whitebg.style.display = "none";
        dlg.style.display = "none";
    }
    function showDialog(){
        var whitebg = document.getElementById("white-background");
        var dlg = document.getElementById("dlgbox");
        whitebg.style.display = "block";
        dlg.style.display = "block";
        var winWidth = window.innerWidth;
        dlg.style.left = (winWidth/2) - 480/2 + "px";
        dlg.style.top = "150px";
    }

Je voudrais que chaque bouton m'envoie une boite de dialogue avec un texte différent, or ici ce n'est pas le cas et je ne vois pas comment faire, peut-être que je n'ai pas codé ce qu'il faut pour ce que je veux faire...

PS: je ne connais pas trop le javascript, je me suis énormément aidé par google (en fait j'ai fais copier/coller xD)