Version conflicts

Version conflicts

i an very new to all things HTML and I have been struggling for a few days to get a from to datepicker working. Finally succeeded and then decided I should upgrade to the latest version of jquery as I had started with  some sample code that use 1.8. 

I was able to upgrade to 2.24 but moving to 3.0 or newer created a problem in the test I was creating. I have tried adding the migrate plugin and the problem persists.

The offending code is: from = $(this).datepicker();  and I later use the from variable to assign a minDate or maxDate to the datepicker.

The 3.0 library returns
[input#dp1476295615721.myDate.hasDatepicker]
whereas the earlier versions of the library return 
[input#dp1476297280422.myDate.hasDatepicker, context: input#dp1476297280422.myDate.hasDatepicker]

I have exhausted the extent of my ability to get to the latest version and any assistance is greatly appreciated.
Thanks John

 I have included the full code below 
<head>
  <title>from to datepicker</title>
  <link href=
  "stylesheet" type="text/css" />
  "text/javascript">
</script>
  type="text/javascript">
</script>
<!-- script(src=' http://code.jquery.com/jquery-migrate-git.min.js', type='text/javascript')
                 -->

  <script type="application/javascript">
                      //<![CDATA[
                        var min = "2016-01-01";
                        var max = "2016-04-01";
                        $(document).ready(function()
                        {
                          var myCounter = 1;
                          $(".myDate").datepicker(
                          {
                              dateFormat: "yy-mm-dd",
                              defaultDate: min,
                              minDate: min,
                              maxDate: max,
                              changeMonth: true,
                              numberOfMonths: 1
                          });
                          var from;
                          var to;
                          $('.targetDates input[name=fromDate]').each(function(index)
                          {
                            console.log(" at init ",this);
                            console.log(" at init ",$(this).datepicker());
                            from = $(this).datepicker();
                            console.log(" at from ",from);
                          });
                          $('.targetDates input[name=toDate]').each(function(index)
                          {
                            to = $(this).datepicker();
                          });
                          $(".myDate").on('change', function()
                          {
                            console.log("At on change ", $(this.name).selector);
                            if ($(this.name).selector == "fromDate")
                            {
                              to.datepicker( "option", "minDate", getDate( this ) );
                            }
                            if ($(this.name).selector == "toDate")
                            {
                              from.datepicker( "option", "maxDate", getDate( this ) );
                            }
                            function getDate( element )
                            {
                              var date;
                              var dateFormat = "yy-mm-dd";
                              try
                              {
                                date = $.datepicker.parseDate( dateFormat, element.value );
                              }
                              catch( error )
                              {
                                date = null;
                              }
                              console.log(date);
                              return date;
                            } 
                          });
                        });
                        //]]>
  </script>
</head>

<body>
  <form id="samplecode" name="samplecode" method="post" action="">
    <fieldset>
      <legend>&nbsp;jQuery DatePicker DEMO&nbsp;</legend>

      <div class="targetDates">
        <input type="text" name="fromDate" class="myDate hasDatepicker" size="10" value=
        "" id="dp1476298531607" /> &nbsp;from date (yyyy-mm-dd) <input type="text" name=
        "toDate" class="myDate hasDatepicker" size="10" value="" id="dp1476298531608" />
        &nbsp;to date (yyyy-mm-dd)
      </div>
    </fieldset>
  </form>
</body>
</html>