Here, we shall represent the table is 2D array, and use the indices to access the array. Each customer and his orders are looped through in order to get individual totals and grand total.
Code is a HTML page with JavaScript embedded
-- code start : answer.html --
<html>
<head>
<script type="text/javascript">
// Table item-prices
let items = [
["Apple",2],
["Orranges",1.5],
["Pears",2.5],
["Mangos",0.5],
["Mellons",2.0],
["Berries",3]
];
// Table item-orders
let orders = [
["ABC",5,4,2,10,2,0],
["DEF",8,3,4,0,0,2],
["XYZ",2,3,0,0,0,1],
["WXY",0,0,4,12,2,4],
["PQR",1,3,2,6,0,3]
];
// Compute the total for each customer
let grandTotal = 0;
document.write("<h2> Customer reports </h2>");
for (let i=0; i < orders.length; i++) { // Loop through orders
let customerTotal = 0;
let order = orders[i]; // Current order
document.write("<table border=1><tr><td colspan=4> Customer Name: " + order[0] + "</td></tr>");
document.write("<tr><td>Item</td><td>Quantity</td><td>Rate</td><td>Total</td></tr>");
for (let j = 0; j < items.length; j++) { //Loop through items
if (order[j+1] > 0) { // Check if current item is brought
let item = items[j];
let total = item[1] * order[j+1];
customerTotal += total;
document.write("<tr> <td>" + item[0] + "</td><td>" + order[j+1] + "</td><td>" +item[1] + "</td><td>" + total + "</td></tr>") // Write table row
}
}
customerTotal += 5; // Delivery charge
document.write("<tr><td colspan=3>Delivery charge</td><td>5</td></tr>");
document.write("<tr><td colspan=3>Customer Total</td><td>" + customerTotal + "</td></tr></table>");
grandTotal += customerTotal;
document.write("<br/><br/>") // Spacing
}
document.write("<h2> Summary </h2>");
document.write("Grand Total of a day = " + grandTotal);
</script>
</head>
<body>
</body>
</html>
-- code end --
Sample output:


Fruit Delivery Service Example TABLE ITEM-ORDERS Index I (ID Name Apples ABC DEF Mangos Melons Berries Oranges Pears 0...