onChange e onSelect em DropDownList

Tenho um DropDownList que pergunta ao usuário se ele deseja ingressar no clube:

Do you want to join the club
Yes
No

Nesta lista, há outra lista definida como desativada como padrão. Esta lista tem os departamentos do clube. Esta lista não será ativada até que o usuário escolha Sim.

Eu criei o código a seguir, mas o problema que não consegui resolver é que vamos assumir que o usuário escolhe Sim e, em seguida, ele muda sua decisão para escolher Não novamente. Nesse caso, a lista dos departamentos ainda está ativada. Quero que seja desativado quando ele escolher Não novamente.

<html>
    <head>
        <script type="text/javascript">
            function disable()
            {
                document.getElementById("mySelect1").disabled=true;
            }
            function enable()
            {
                document.getElementById("mySelect1").disabled=false;
            }
        </script>
    </head>
    <body>
        <form>
            <select id="mySelect" onChange="enable();">
                <option onSelect="disable();">No</option>
                <option onSelect="enable();">Yes</option>
            </select>
            <select id="mySelect1" disabled="disabled" >
                <option>Dep1</option>
                <option>Dep2</option>
                <option>Dep3</option>
                <option>Dep4</option>
            </select>
        </form>
    </body>
</html>

Eu pensei queonSelect="disable();" resolveria o problema, mas ainda não funciona.

Obrigad

questionAnswers(10)

yourAnswerToTheQuestion