显示/隐藏输入字段取决于所选选项

Question

如果所选选项为“已结婚”但我想显示输入字段，但如果所选选项为“单个”，则输入字段将隐藏。

这是我的代码：

<div class="form-group">
                            <label for="civil_status">Civil Status</label>
                            <select class="form-control" id="civil_status" name="civil_status">
                                @if ($edit)<option value="{{ $user->civil_status}}">{{ $user->civil_status }}</option>@endif
                                <option value="Single">Single</option>
                                <option value="Married">Married</option>
                                <option value="Widowed">Widowed</option>
                                <option value="Divorced">Divorced</option>
                            </select> 
                        </div>
            <div id="row1_col1_layout_type2" class="content">
                <div class="form-group">
                    <label for="spouse">Spouse</label>
                    <input type="text" class="form-control" id="spouse"
                           name="spouse" placeholder="Spouse" value="{{ $edit ? $user->spouse : '' }}">
                </div>
            </div>

然后我的脚本就像这样

<script>
$('#civil_status').change(function() {
    var i= $('#civil_status').val();

            if(i=="Single") // equal to a selection option
             {
                 $('.content').hide();
             }
           elseif(i=="Married")
             {
              $('.content').show();

              }
   $.ajax({

   });
}).change();
</script>