I can give you some advice on how you can manage the dropdown list programmatically using Javascript. The actual dropdown is created using HTML elements, a <select> object with a collection of <option> objects nested below it. They have the following syntax:

<select id="Field20" class="form-item-field cf-medium" vo="e" name="Field20">
    <option value="1">choice 1</option>
    <option value="2">choice 2</option>
    <option value="3">choice 3</option>
</select>

Notice that the value of each choice is a "value" attribute of the option element, and the option text is between the opening and closing tags. You need to modify the HTML of the page to change the list. For instance, if I wanted to remove all these options from my dropdown (id=q20) and replace them with new ones, I could do the following:

var target = $('#q20 select');
target.find('option').remove();
$('<option value="1">1 Point</option>').appendTo(target);
$('<option value="3">3 Points</option>').appendTo(target);
$('<option value="5">5 Points</option>').appendTo(target);

If you want to read the text or values, you need to find the ':selected' option associated with your dropdown. This will display both the text and value of the dropdown any time it changes:

$('#q20 select').change( function () {
      alert("Value: "+$('#q20 :selected').val()+"    Text: "+$('#q20 :selected').text());
});

Perhaps you can integrate this with Ken's suggestion of using hidden fields to get the end result you're looking for.

Also, as a beginniner with Javascript, I strongly recommend using a browser with good developer tools, like Firefox or IE which have a DOM inspector. It'll really help you understand the structure of the HTML, how the CSS rules apply to the elements, and how to find and select the right properties to modify with JS.