How to output two arrays to an html table with a delete button to confirm delete
<p>Here is my code to insert the movie info into the two arrays and then output it to the screen with a table.    How do I get the delete button to show up and to get the titles and directors on separate columns?</p>

<pre><code>var titles  = [];
var names   = [];

var titleInput  = document.getElementById("title");
var nameInput   = document.getElementById("name");    
var messageBox  = document.getElementById("display");

function insert ( ) {
    titles.push( titleInput.value );
    names.push( nameInput.value );    

    clearAndShow();
}

function clearAndShow () {
    // Clear our fields
    titleInput.value = "";
    nameInput.value = "";
}

// Print the info to a table
function show() {
    document.write('&lt;table&gt;');
    document.write('&lt;tr&gt;&lt;th&gt;Titles&lt;/th&gt;&lt;/tr&gt;');

    for (var i = 0; i &lt; titles.length; i++) {
        document.write('&lt;tr&gt;&lt;td&gt;' + titles[i] + '&lt;/td&gt;&lt;/tr&gt;');
    }
    document.write('&lt;tr&gt;&lt;th&gt;Directors&lt;/th&gt;&lt;/tr&gt;');

    for (var i = 0; i &lt; names.length; i++) {
        document.write('&lt;tr&gt;&lt;td&gt;' + names[i] + '&lt;/td&gt;&lt;/tr&gt;');
    }

    document.write('&lt;/table&gt;');    
}
//delete Button-reset
</code></pre>