Add text field to form upon selection of "Other" from Drop

<!-- Add this section to your TEMPLATES configuration settings under "custom checkout fields" -->

{% if add_other is not defined %}
    {% set add_other = false %}
{% endif %}

<div class="fc-form-group ">
    <div class="col-sm-8 col-sm-offset-3" data-fc-error-for="referral_source" data-fc-error-class="fc-alert-container--error">
        <div class="fc-input-group-container fc-input-group-container--checkbox fc-input-group-container--active">
            <label class="fc-input-group-container__title fc-input-group-container__title--forced fc-form-label">
                How did you find Us?… (required)
            </label>
            <div class="fc-form-group">
                <p>Referred by?</p>
                    <select name="referral_source" id="referral_source" class="fc-form-control" aria-required="true" data-fc-required >
                    <option value="Google" {% if referral_source == "Google" %}selected{% endif %}>Google</option>
                    <option value="Yahoo" {% if referral_source == "Yahoo" %}selected{% endif %}>Yahoo</option>
                    <option value="Bing" {% if referral_source == "Bing" %}selected{% endif %}>Bing</option>
                    <option value="Facebook" {% if referral_source == "Facebook" %}selected{% endif %}>Facebook</option>
                    <option value="Instagram" {% if referral_source == " Instagram " %}selected{% endif %}> Instagram </option>
                    <option value="Twitter" {% if referral_source == " Twitter" %}selected{% endif %}> Twitter</option>
                    <option value="Friend" {% if referral_source == "Friend" %}selected{% endif %}>Friend</option>
                    <option value="Amazon" {% if referral_source == "Amazon" %}selected{% endif %}>Amazon</option>
                    <option value="Email" {% if referral_source == "Email" %}selected{% endif %}>Email</option>
                    <option value="Returning Customer" {% if referral_source == "Returning Customer" %}selected{% endif %}>Returning Customer</option>
                    <option value="Other" {% if referral_source == "Other" %}selected{% endif %}>Other</option>
                    </select>
            </div>
    		{% if add_other == true %}
        		<div class="fc-form-group">
            		<input type="text"
                	id="other_text"
                	name="other_text"
                	placeholder="Please enter 'Other'"
                	class="fc-form-control fc-form-control--new-customer-password"
                	data-fc-required
                	value="{{ other_text }}"
                	/>
        		</div>
    		{% endif %}
        </div>
    </div>
</div>


<!-- Add this into your TEMPLATES configuration in "Add custom header and footer code to your templates->custom footer" -->
<!-- Do not overwrite code that is already there -->

{% if context == "checkout" %}
<script>
$("body").on("change", "#referral_source",
    function() {
        var change_to = $( "select#referral_source" ).val();
        if (change_to == "Other") {
            FC.json.add_other = true;
        }
        else {
            FC.json.add_other = false;
        }
            FC.checkout.renderAdditionalFields();
            $("#referral_source").val(change_to);
     });
    </script>
{% endif %}