Here are the codes to modify as instructed above:

-------------------------------------------------------------

Use a Test Score array

Name:

Score:

-----------------------------------------------------------------

var names = ["Ben", "Joel", "Judy", "Anne"]; var scores = [88, 98, 77, 88];

var $ = function (id) { return document.getElementById(id); };

window.onload = function () { $("add").onclick = addScore; $("display_results").onclick = displayResults; $("display_scores").onclick = displayScores; };

--------------------------------------------------------------

body { font-family: Arial, Helvetica, sans-serif; background-color: white; margin: 0 auto; padding: 10px 20px; width: 600px; border: 3px solid blue; } h1 { color: blue; margin-top: 0; margin-bottom: .5em; } h2 { color: blue; font-size: 120%; padding: 0; margin-bottom: .5em; } main { padding: 1em 2em; } label { float: left; width: 3em; text-align: right; } input { margin-left: 1em; margin-bottom: .5em; } p { margin: 0; } td { width: 10em; }

----------------------------------------------------

Thanks!

In this exercise, you start with the declarations for two arrays, a names array anda scores array. Then, you'll add an event handler that displays the names and scores in the text area of the interface. Estimated time: 20-30 minutes Use a Test Score array Name: Mike Score: 99 Add to Array Display Scores Ben 88 Joel -98 udy77 Anne 88 1. Open the HTML and JavaScript files in this folder: exercises short\ch05 test scores\ If you run the application, you can enter a name and score and then click the Add to Array button to add names and scores to the arrays, but you can't use the other button to display the scores 2. Look at the JavaScript code to see that it starts with the declarations for two arrays that contain four elements each. The first is an array of names. The second is an array of scores. Note too that the JavaScript code includes the S function, an onload event handler, and the addScore function for adding a name and score to the arravs 3. Add an event handler for the Display Scores button that displays the names and scores in the arrays, as shown above. You will also need to use the onload event handler to attach this function to the click event of the Display Scores button. After you test this with the starting array values that are shown above, add a name and score to the arrays and test the display again 4. Modify the event handler for the Add to Array button so the data in the text area is cleared after a name and score are added to the arrays