How do I do a switch case for jQuery?

I have this if-else statement which gave me weird response... whenever i select "output" first, nothing else selected afterwards can appear... FYI, I am using multi select so I can select and show as many as I want.

 $('#outputText').hide();
    $('#armCB').hide();
    $('#outputCB').hide();
    $('#zoneText').hide();
    $('#counterText').hide();
    $('#flagText').hide();
    $('#sensorText').hide();

('#select-choice-1').change(function(){
        if ($('#output').is(':selected')){
            $('#outputText').show();
        }
        else if ($('#arm').is(':selected')){
            $('#armCB').show();
        }
        else if ($('#zone').is(':selected')){
            $('#zoneText').show();
        }
        else if ($('#counter').is(':selected')){
            $('#counterText').show();
        }
        else if ($('#flag').is(':selected')){
            $('#flagText').show();
        }
        else if ($('#sensor').is(':selected')){
            $('#sensorText').show();
        }
        else{
            $('#outputText').hide();
            $('#armCB').hide();
            $('#zoneText').hide();
            $('#counterText').hide();
            $('#flagText').hide();
            $('#sensorText').hide();

        }

Is there a mistake in my if-else statement? or must I use Switch case statement here? If so, how should i do it?

HTML:

<div id="display" style=" clear:both">
        <div class="left" style="float:left; width:48%">
        <div data-role="fieldcontain">
            <label for="select-choice-1" class="select">Select Category</label>
            <select name="select-choice-1" id="select-choice-1" data-native-menu="false" data-mini="true" multiple="multiple" size="2">

                <option value="arm" id="arm">Arm</option>
                <option value="zone" id="zone">Zone Input</option>
                <option value="output" id=