title: How to extract values from HTML <input type="date"> using jQuery
body: <p>Using an HTML <code>input type="date"</code> and a submit button. I would like to populate the variables <code>day</code>, <code>month</code>, and <code>year</code> with the appropriate values from the date input.</p>
  
  <pre><code>&lt;input type="date" id="date-input" required /&gt;
  &lt;button id="submit"&gt;Submit&lt;/button&gt;
  </code></pre>
  
  <p>and the jQuery:</p>
  
  <pre><code>var day, month, year;
  
  $('#submit').on('click', function(){
    day = $('#date-input').getDate();
    month = $('#date-input').getMonth() + 1;
    year = $('#date-input').getFullYear();
    alert(day, month, year);
  });
  </code></pre>
  
  <p>Here's a code sample:
  <a href="https://jsfiddle.net/dkxy46ha/" rel="noreferrer">https://jsfiddle.net/dkxy46ha/</a></p>
  
  <p>the console error is telling me that <code>.getDate()</code> is not a function.</p>
  
  <p>I have seen similar questions but the solutions have not worked for me. How can I extract the day, month and year from the <code>input type="date"</code>? Thanks</p>