JQuery Daterangepicker storing in global variables

Question

I'm trying to get input from jQuery daterange picker and storing it in global variables which I can call in test.js. My test.js has a MongoDB aggregate framework that outputs a JSON file with Time, Humidity and Temperature. These values are used to plot a line chart.

    var startValue, endValue;
    $("#from").datepicker(
    {
        onSelect: function()
        {
             startValue = $(this).datepicker('getDate');

        }

    });

$("#to").datepicker(
    {
        onSelect: function()
        {
            endValue = $(this).datepicker('getDate');
        }
    });

index.html

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.12.4.js"></script>
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<p>Start Date: <input type="text" id="from"></p>
<p>End Date: <input type="text" id="to"></p>
<input type="submit" value="Get Data">

test.js

{ $match : { datetime : { $gt : startDate, $lt : endDate } } },
  {
   $group: {
    _id:{
    "$add": [
     { "$subtract": [
     { "$subtract": [ "$datetime", new Date(0) ] },
     { "$mod": [
    { "$subtract": ["$datetime" , new Date(0) ] },
    offset]}] },
    new Date(0)
     ]},
            Humidity: {$avg: "$humidity"},
            Temperature: {$avg: "$temperature"}

            },
            },

      { $project : { _id : 1 , Humidity : 1, Temperature: 1 } },
       // { $limit : 10 },
       { $sort :  {"_id":1, "Humidity":1, "Temperature": 1}}

I will like to use a click event to update the variable so I can use it in my test.js