jquery - Form validation error message not working -

i had custom code added shopping cart worked beautifly. @ point, error message displays when required field not filled out, stopped working.

here code: (revised html included)

{% assign choices = "other, affiliate, returning customer, practitioner, dr. ulan, dr. shallenberger, dr. dennis courtney, wbai - take charge of health radio, chek institue, bodyhealth newsletter, yasmine marca, ben greenfield, steve ilg, tawnee prazak, abc4u, natural awakenings, email advertisment, facebook, twitter, google, forum, friend, letter, optimum healt report, townsend letter, autism avenue" %} {% assign required = true %}  <div class="form-vertical"> <p> <select style="margin-left: 0px;" class="six columns" 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 selection</option> {% assign optionsarray = choices | split: ',' %} {% 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 style="text-align: left;" class="three columns mobile_left alpha" for="how-did-you-hear-about-us-other">where?:</label> <input class="six columns" 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> <p style="{% unless cart.attributes.how-did-you-hear-about-us == 'affiliate' %}display:none;{% endunless %}"> <label style="text-align: left;" class="three columns mobile_left alpha" for="how-did-you-hear-about-us-affiliate">who?:</label> <input class="six columns" id="how-did-you-hear-about-us-affiliate" type="text" name="attributes[how-did-you-hear-about-us-affiliate]" value="{{ cart.attributes.how-did-you-hear-about-us-affiliate }}" /> </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();     }   });     $('#how-did-you-hear-about-us').change(function() {     if ($('#how-did-you-hear-about-us').val() == 'affiliate') {       $('#how-did-you-hear-about-us-affiliate').parent('p').show();     } else {       $('#how-did-you-hear-about-us-affiliate').val('').parent('p').hide();     }   });   {% if required %}   $('input[name="checkout"], input[name="goto_pp"], input[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() == 'affiliate') {       if ($('#how-did-you-hear-about-us-affiliate').val() == '') {         validated = false;          $('#how-did-you-hear-about-us-affiliate').addclass('error');       }      }     if(validated){       $(this).submit();     }     else{       alert("please tell how heard us.");       return false;     }   });   {% endif %} }); </script> 

i'm using shopify store if matters. furthermore, wouldn't mind making flyout or popup message make stand out more.

currently i'm receiving no error message @ all, nothing happens. however, people cannot click checkout don't realize required field. think site broken.

all appreciated.