using jquery datepicker

using jquery datepicker

hello i'm trying to use the jquery validator in a bsp. but the comparison is not working, i'm a newbie with javascript, i tried to follow the tutorial from  http://keith-wood.name/uiDatepickerValidation.html but i do not have result,
this is the function i'm using
   <script>
    $( document ).ready(function() {
        CKEDITOR.replace('news_editor');
  $('#validBeforeDatepicker,#validAfterDatepicker').datepicker();
            $('#dati').validate({
              rules: {
              validBeforeDatepicker: {
               dpCompareDate: ['before''#validAfterDatepicker']
               },
                validAfterDatepicker: {
                  dpCompareDate: {after : '#validBeforeDatepicker'},
                }
              },
              messages: {
                validAfterDatepicker: 'Per favore inserire una data posteriore a quella di inizio.'
              }
            });
          });// .ready() END
    </script>


















while in the form i'm using 
  <label for= "dataini"  class= "required"  accesskey= "f" >Data inizio validita: </label>
         <input type="text" class="required" class="dpDate" id="validBeforeDatepicker" name="dataini" tabindex="1" value="" title="Inizio" validate ="TRUE"><br>
       <label for="datafine" class="required" accesskey="l">Data fine validita: </label>
         <input type="text" id="validAfterDatepicker" class="dpDate" name="datafine" tabindex="2" title="Fine"><br>


do i miss something?