I need to get a random answer from a certain array if a condition is met

I'm trying to workout a way to input either checkboxes or a dropdown list where you can check multiple items, then from the checked/selected items you click a generate button and it will produce a random answer, i have the following already but this means I have to type in the options manually in comma separated format which I don't want! any ideas on how i can achieve this? apologies if i sound stupid, im a novice coder!

<form method="get" action="/" onsubmit="return false;">
        <fieldset>
            <label>
                Things to pick from&#8230;<br>
                <div style="font: 12px/1.5 helvetica, sans-serif;">Comma-separated list</div>
                <textarea style="width: 400px;height: 100px;" name="things" id="things">Enter your options here..</textarea>
            </label>
        </fieldset>
        <p>
            <input type="button" value="Find my Food" onclick="rnd();">
            <img id="ajax-loader" src="ajax-loader.gif" alt="Picking..."
        </p>
    </form>

<script type="text/javascript">

    var rnd = function () {
        var loader, things;
        loader = document.getElementById('ajax-loader');
        loader.style.display = 'inline';
        things = document.getElementById('things').value;
        things = things.replace(', ', ',');
        things = things.split(',');
        setTimeout(function () {
            var thing;
            loader.style.display = 'none';
            thing = Math.floor(Math.random() * things.length);
            document.getElementById('result').innerHTML = things[thing];
        }, 500);
    };

    </script>
    <h2>Result:</h2>
    <div id="result">Click &#8220;Find My Colour!&#8221;</div>
    </font><br />

Thanks so much in advance!