Asking a customer “how did you hear about us” on the cart page in Shopify

hear-about-us.liquid

{% assign choices = "Facebook, Twitter, Google, Best Toys Bulletin, John Doe" %}
{% assign required = true %}

<div class="form-vertical">
  <p>
    <label for="how-did-you-hear-about-us">How did you hear about us?</label>
    <select id="how-did-you-hear-about-us" name="attributes[how-did-you-hear-about-us]">
      <option value=""{% if cart.attributes.how-did-you-hear-about-us == "" %} selected{% endif %}>Please make a selection</option>
      {% assign optionsArray = choices | split: ',' %}
      {% for o in optionsArray %}
        {% assign option = o | strip %}
        <option value="{{ option }}"{% if cart.attributes.how-did-you-hear-about-us == option %} selected{% endif %}>{{ option }}</option>
      {% endfor %}
      <option value="Other"{% if cart.attributes.how-did-you-hear-about-us == "Other" %} selected{% endif %}>Other</option>
    </select>
  </p>
  <p style="{% unless cart.attributes.how-did-you-hear-about-us == 'Other' %}display:none;{% endunless %}">
    <label for="how-did-you-hear-about-us-other">Other:</label>
    <input id="how-did-you-hear-about-us-other" type="text" name="attributes[how-did-you-hear-about-us-other]" value="{{ cart.attributes.how-did-you-hear-about-us-other }}" />
  </p>
</div>

<script>
jQuery(function($) {
  $('#how-did-you-hear-about-us').change(function() {
    if ($('#how-did-you-hear-about-us').val() == 'Other') {
      $('#how-did-you-hear-about-us-other').parent('p').show();
    } else {
      $('#how-did-you-hear-about-us-other').val('').parent('p').hide();
    }
  });
  {% if required %}
  $('[name="checkout"], [name="goto_pp"], [name="goto_gc"]').click(function() {
    var validated = true;
    if ($('#how-did-you-hear-about-us').val() == '') {
      validated = false;    
    }
    else if ($('#how-did-you-hear-about-us').val() == 'Other') {
      if ($('#how-did-you-hear-about-us-other').val() == '') {
        validated = false; 
        $('#how-did-you-hear-about-us-other').addClass('error');
      } 
    }
    if(validated){
      $(this).submit();
    }
    else{
      alert("Please tell us how you heard about us.");
      return false;
    }
  });
  {% endif %}
});
</script>

I copied this code but the additional drop down function when a customer selects 'other' does not seem to work. Am I missing something? also, it does not seem to require the customer to answer. The directions state that if the code states 'By default, our code already contains a validation script. If you prefer to make it optional to answer the question, change line no 2 in your hear-about-us.liquid snippet from this:
{% assign required = true %} to {% assign required = false %}. Mine is true. Thanks for your help, Tami

Thanks for this Caroline!
I'm totally new to Shopify and doing anything like this with the web but you've really make it super easy to make some pretty important modifications.
So thank you thank you thank you!!

Hi SDTEEJAY, I had the same problem but I was using the cart 'drawer' when I opted for 'page' it functioned as it should. Thanks to a little helpful advice from the shopify gurus.
Thank you Caroline!

Hi Caroline,
Just a question, if I want to add another option like "Other" with the possibility to write a comment for the client, for exemple: "how did you heard about us" and below of "Other" a new selection like: "on a blog" and the customer can write on which blog she saw us. Do you have instructions and code for that ?

PS : sorry for my englidh and thanks a lot for your help :))))