title: Jquery scrollintoview not working Error - Property Undefined
body: <p>Can anybody see why this is not working, the element is fine. i think see below, Help greatly appreciated. Thank you.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>//check for key press and check for errors in form fields
  $(document).ready(function() {
    $(document).keyup(checksub);
  });
  //checks for errors in forms on submit - callled from checkerrors.
  function checksub() {
    checkphone();
  }
  
  
  
  function checkphone() {
  
  
    var phone = $("#phonevalue").val();
    var phoneReg = /^[0-9][0-9 \r\n]{10,11}$/;
  
  
    if (!phoneReg.test(phone)) {
      localStorage.setItem('error', 'true');
      event.preventDefault(); //ERROR THROWN HERE
  
      $("#phonefooter").text("11-12 Numbers Please!"), $("#phonevalue").addClass("errorclass"), $("#phonevalue").removeClass("noerrorclass"), $('#phonefooter').css('color', 'red'), $("phonefooter").get(0).scrollIntoView();
    }
  
    if (phoneReg.test(phone)) {
      localStorage.setItem('error', 'false');
  
      $("#phonefooter").text("phone Number Is Good, Thanks!"), $("#phonevalue").addClass("noerrorclass"), $("#phonevalue").removeClass("errorclass"), $('#phonefooter').css('color', '#4caf50');
    }
  
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;div class='container'&gt;
  
    &lt;div class='listtitle' title='Enter The Sellers Phone Number'&gt;Phone Number&lt;br&gt;
      &lt;h5&gt;Enter Sellers Mobile or Phone Number&lt;/h5&gt;
    &lt;/div&gt;
  
  
    &lt;input type='numbers' pattern=".{10,13}" min="10" max="13" class='text' name='phone1' id='phonevalue' style='min-width:260px; max-width:300px;' value='&lt;?php echo $phone1; ?&gt;' required&gt;
  
    &lt;div id='phonefooter' class='phonefooter'&gt;Max Numbers: 20&lt;/div&gt;
  
  
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>The error thrown is </p>
  
  <p>Uncaught TypeError: Cannot read property 'scrollIntoView' of undefined</p>
  
  <p>Any Ideas as to why?</p>
  
  <p>Thanks Again.</p>