Show Table On Radio Button Select, Then Pass Radio Button Value To Field In Table, Option To Add More, Then Append To Existing Table

First-time poster...please don't beat me up too bad. I'm not even sure how all of this works, but here goes. I'm basically trying to recreate the form located here: http://yeticust

Solution 1:

Here you go. Please pay attention to the comments for the explanation.

// 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("cupSelect").style.display = "none";
    });
}

Note that you should hide the selection table until the radio button is clicked with style='display:none'

Here's a fiddle

Happy coding!