Question

I use the script below to toggle the County menu, I am trying to get it to hide the county menu if on page load any country other the “United Kingdom” is selected and if the user selects another country once the page has loaded, problem is if “United Kingdom” is selected when the page loads the “county” menu is still hidden and you have to select another country first then select back to “United Kingdom to get the County list to show.

<script type="text/javascript">
    $(document).ready(function(){
       $(".selectWrapper").on("change", "select#country", function(){
          $("select.county").toggle($(this).val() == "United Kingdom");
       });
    });

    </script>



    <script type="text/javascript">
    $(document).ready(function() {
           if($("select.country") != "United Kingdom") {
          $("select.county").toggle();
          }
    });
    </script>

Answer 1

You are missing the call of your .val() in the second if statement ! You are currently comparing an jQuery Object with a String.

<script type="text/javascript">
    $(document).ready(function(){
       $(".selectWrapper").on("change", "select#country", function(){
          $("select.county").toggle($(this).val() == "United Kingdom");
       });
    });

    </script>



    <script type="text/javascript">
    $(document).ready(function() {
           if($("select.country").val() != "United Kingdom") {
          $("select.county").toggle();
          }
    });
    </script>