create jquery array to use as options

Question

Hi all, I'm sure this is really simple, but I can't seem to get it working. I have a "time" select list, which has a number as "rel" attached to each option. If the user changes the time select, I want a new list of options to display depending on what is selected. If that makes sense?

Here's my first select:

<select name="time" id="time">
  <option value="7:00am" rel="10">7:00am</option>
  <option value="12:30pm" rel="16">12:30pm</option>
</select>

If the user selects 7:00am, I want a new option list (using jquery) to give options from 1 - 10. Like this:

<select name="quantity" id="quantity">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  ............................
  <option value="10">10</option>
</select>

Here's what I have so far...

<script type="text/javascript" language="javascript">
  jQuery("#time").change(function(){
    var positions = jQuery("#time :selected").attr("rel"); //this grabs the rel from time

    //this is where it should create a list of options to append(??) to the select list..

    jQuery("#showQuantity").show(); //this shows the hidden field for quantity
  });
</script>

I hope it makes sense, but I'm stuck on it. Thank you in advance :)

Answer 1

Below is the code you can use for adding options.

    $("#quantity").empty();//Clear options if there are any already existing ones.

    for( i=1; i<= positions; i++ )
    {

        $("#quantity").append($("<option value="+i+">"+ i+"</option>") );

    }