Question

I was wondering if there was a way to condense this code better so that I don’t have to code every possible scenario. Any help is appreciated.

  $('select.contactselect').change(function(){
   var selectVal = $(this).val();
   if(selectVal == 'press'){
    $('.support').slideUp('fast');
    $('.general').slideUp('fast');
    $('.press').delay(100).slideDown('fast', function() {
        // Animation complete.
    });
  }else if (selectVal == 'general'){
    $('.press').slideUp('fast');
    $('.support').slideUp('fast');
    $('.general').delay(100).slideDown('fast', function() {
      // Animation complete.
    });
  }else if (selectVal == 'support'){
    $('.press').slideUp('fast');
    $('.general').slideUp('fast');
    $('.support').delay(100).slideDown('fast', function() {
      // Animation complete.
    });
  }
  });

Answer 1

Add a class ‘all_lists’ to all those three elements with classes (press, general and support) and then use following.

$('select.contactselect').change(function(){
  var selectVal = $(this).val();

  $('.all_lists').slideUp('fast');
  $('.' + selectVal).delay(100).slideDown('fast', function() {
// Animation complete.
});

});