Hi Guys

I have an select dropdown looking like this:

1. <select name="dietary" id="dietary">
       <option value="none" selected="selected" >Select Option</option>
       <option value="Normal"  <?php echo "$selected1" ?>>Normal</option>
       <option value="Vegetarian" <?php echo "$selected2" ?>>Vegetarian</option>
       <option value="Halaal" <?php echo "$selected3" ?>>Halaal</option>
       <option value="Kosher" <?php echo "$selected4" ?>>Kosher</option>
       <option value="Other" <?php echo "$selected5" ?>>Other</option>
    </select>

Now my client is very picky and she does not want the "Select Option" (first option) to show when you click on the dropdown list. So I need to remove it when I click on the select. Now I know a select does not have a onclick handler so is there any work-around this?

I have tried a click function of things but it only works on a onChnage.

1. $(document).ready(function() {
    $('#dietary).click(function () {
     $("#dietary option[value='none']").remove();
    });
   });

Thanks