Conditional textbox fields to appear based on drop-down menu selection

by Akram kamal

HTML

<div class="form-group">
    <label class="control-label">Reason for Request</label>
    <select id="reasonRequest" name="reasonRequest" class="form-control input-sm">...
        <option value="">--Please Select--</option>
        <option value="servicesQuestionsComments">Services Questions</option>
        <option value="Product Inquiry">Product Inquiry</option>
        <option value="contractBillingQuestionsComments">Contract/Billing Questions</option>
        <option value="technicalSupportComments">Technical Support</option>
        <option value="otherComments">Other (Please Explain)</option>
    </select>
</div>
<div class="form-group" id="servicesQuestionsComments">
    <label class="control-label">Tell us about your services questions</label>
    <textarea class="form-control" rows="5" id="servicesQuestions"></textarea>
</div>
<div class="form-group" id="contractBillingQuestionsComments">
    <label class="control-label">Tell us about your contract/billing questions</label>
    <textarea class="form-control" rows="5" id="contractBillingQuestions"></textarea>
</div>
<div class="form-group" id="technicalSupportComments">
    <label class="control-label">Tell us about your technical support questions</label>
    <textarea class="form-control" rows="5" id="technicalSupport"></textarea>
</div>
<div class="form-group" id="otherComments">
    <label class="control-label">Please explain</label>
    <textarea class="form-control" rows="5" id="other"></textarea>
</div>

JavaScript

$(function(){
    $(".form-group").slice(1).hide()
    $("#reasonRequest").change(function(){
        console.log($(this).val())
        $(this).parent().siblings(".form-group").slideUp("fast");
       $("#"+ $(this).val()).slideDown("fast")
        
    })
})