删除阵列中的当前节点onclick

Question

我正在开发一个订购应用程序，需要允许用户删除以前输入的订单。 “删除”按钮当前从屏幕中删除所有输出，并且当添加新订单时，所有过去的订单和新订单重新出现，而不是单个新订单。

// Global Variables
var orderTotal = 0;
var grandTotal = 0;
var burritos = [];

function init() {
    var btnAddToOrder = document.getElementById("addToOrder");
        btnAddToOrder.onclick = processOrder;
}

function processOrder() {
    var fieldBurrito = document.getElementById("burrito");
        var index = fieldBurrito.selectedIndex;
        var burritoChoice = fieldBurrito.options[index].value;
    var fieldRice = document.getElementsByName("rice");
        for (var a = 0; a < fieldRice.length; a++) {
            if (fieldRice[a].checked) {
                var riceChoice = fieldRice[a].value;
           } else {
                riceChoice = "No";
           }
        }
    var fieldBeans = document.getElementsByName("beans");
        for (var e = 0; e < fieldBeans.length; e++) {
            if (fieldBeans[e].checked) {
                var beansChoice = fieldBeans[e].value;
            } else {
                beansChoice = "No";
            }
        }
    var fieldSalsa = document.getElementsByName("salsa");
        var salsaChoice = "";
        for (var i = 0; i < fieldSalsa.length; i++) {
            if (fieldSalsa[i].checked) {
                salsaChoice += fieldSalsa[i].value + " ";
            }
        }
    var fieldGuac = document.getElementsByName("guacamole");
        for (var o = 0; o < fieldGuac.length; o++) {
            if (fieldGuac[o].checked) {
                var guacChoice = fieldGuac[o].value;
            } else {
                guacChoice = "No Guac";
            }
        }
    //Reset the cost of each individual order
    orderTotal = 0;
    grandTotal = 0;
    //Determine the type of burrito and associate correct cost
    switch (burritoChoice) {
        case "Chicken":
            orderTotal += 6.20;
            break;
        case "Steak":
            orderTotal += 6.75;
            break;
        case "Carnitas":
            orderTotal += 6.60;
            break;
        case "Sofritas":
            orderTotal += 6.20;
            break;
        case "Barbacoa":
            orderTotal += 6.60;
            break;
    }

    if (guacChoice == "Guacamole") {
        orderTotal += 1.40;
    }

    var burritoInstance = {
        "Burrito":burritoChoice,
        "Rice":riceChoice,
        "Beans":beansChoice,
        "Salsa":salsaChoice,
        "Guacamole":guacChoice,
        "Price":orderTotal
    };

    burritos.push(burritoInstance);
    // Check to see that the fieldValues array has at least one element
    if (burritoChoice !== "Choose a Burrito") {
        generateReceipt(burritos);
    } else {
        console.log("Please choose a burrito type to continue. All other toppings are optional.");
    }
}

//********************************************************************************************
function removeButton(i) {
    var removeButton = document.createElement("button");
        var value = document.createTextNode("Remove Order");
        removeButton.appendChild(value);
        removeButton.id = i;
        removeButton.onclick = function() {
            var thing = this.parentNode;
            thing.parentNode.removeChild(thing);
        }
    return removeButton;
}
//--------------------------------------------------------------------------------------------
function br() {
    return document.createElement('br');
}
//********************************************************************************************

function generateReceipt(burritos) {
    var element = document.getElementById("output");
        if(element) {
            element.parentNode.removeChild(element);
        }
    var burritoList = document.createElement("div");
        burritoList.id = "output";
    for(var i=0; i < burritos.length; i++) {
        var outputList = document.createTextNode(burritos[i].Burrito + " Burrito - " +
                                                 burritos[i].Rice + " Rice - " +
                                                 burritos[i].Beans + " Beans - " +
                                                 burritos[i].Salsa + " Salsa - " +
                                                 burritos[i].Guacamole + " - $" +
                                                 burritos[i].Price);
            outputList.id = "burritoInstance";

        grandTotal += burritos[i].Price;
        burritoList.appendChild(outputList);
        burritoList.appendChild(removeButton(i));
        burritoList.appendChild(br());
    }
    var orderTotal = document.createTextNode("Order Total: $" + grandTotal);
        burritoList.appendChild(orderTotal);
    document.body.appendChild(burritoList);
}

在某些时候，我需要在按钮单击中包含逻辑以在删除订单时调整订单总数，但首先我需要能够访问每个按钮之前的订单。

JSFiddle