Dialog in HTML5

<dialog id="window">
    <h3 align="center">Pricing Board</h3>
    <table>
<tr><td>E-learning Module</td><td><input type="checkbox" name="elear" disabled checked /></td></tr>
<tr><td>Mentor</td><td><input type="checkbox" name="ement" /></td></tr>
<tr><td>Special Discount</td><td><input type="text" name="dicount" placeholder="Discount Code" /></td></tr>
<tr><td>Final Price</td><td><input type="hidden" name="final_price" />8978</td></tr>
<tr><td colspan="2" align="center"><input type="submit" name="submit" name="Pay Now" /></td></tr>
</table>
    <button id="exit">Close Dialog</button>
</dialog>
<button id="show">Show Dialog</button>
<script>
(function() {
    var dialog = document.getElementById('window');
    dialog.style.width='350px';
    dialog.style.background='#e8e8e8';
    dialog.style.border='1px solid #dadada';
    dialog.style.padding='5px 10px 20px 20px';
    document.getElementById('show').onclick = function() {
        dialog.show();
    };
    document.getElementById('exit').onclick = function() {
        dialog.close();
    };
})();
</script>