Show/Hide the Div

Show/Hide the Div

I have a div which is initially hidden. When clicking a certain link; the div will be shown...
The function to reverse the show/hide does not seem to be called.

Here is the intialisation :

  1.         <!-- initially hide div -->
            <script type="text/javascript">
                    $('#checkbox_grouped_Options').show ();
                    var showtheoptions = true; // set boolean to false


  1.         <script type="text/javascript">
            function showHidetheOptions() {
                showtheoptions = !showtheoptions //invert value
                if (!showtheoptions) {
                $('#checkbox_grouped_Options').hide ();
                showtheoptions = false; // set to current state to false
                    else {
                    $('#checkbox_grouped_Options').show ();
                    showtheoptions = true; // set to current state to true
            } // end function showHideOptions


this is the link that should call the function
  1.  <a href="" title="opts" id="changeOptions" onclick="showHidetheOptions()"  >show Opt</a>