点击后，我需要隐藏按钮并显示隐藏的div

Question

我正在尝试重新创建位于此处的表单：http://yeticustomshop.com/get-quote（请查看此内容以供参考）

需要的用户体验：

• 选择产品，产品选择将替换为显示
  的表格 产品选择名称，复选框和数量选择器。
• 添加其他产品的选项。如果点击，按钮消失了 产品选择如下表所示。那个过程就是 重复，在表格中添加新的选择。
• 删除以前选定的项目的功能。

Here's the fiddle

// Get all the product radio buttons and loop them
var products = document.getElementsByName('product');
for (var i = products.length; i--;) {
  // add an event listener to do stuff when one of them is clicked
  products[i].addEventListener("click", function() {
    // get the value of the clicked button
    var cup = this.value;
    // put the value in the input box
    document.getElementById('yourSelection').value = cup;
    // hide the radio buttons and show the table
    document.getElementById("cupDesc").style.display = "block";
    document.getElementById("addProductBtn").style.display = "block";
    document.getElementById("cupSelect").style.display = "none";
  });
}

Here's my previous post on here

附注：此过程正在表单中使用。我想知道是否有可能更容易让它像购物车一样。我已经下载了simplecart.js，但Javascript不是我的强项。请帮忙。