title: jQuery Cannot read property 'toLowerCase' of undefined
body: <p>I am reading a chapter from PHP Ajax Cookbook. Here is the code:</p>
  
  <p>HTML:</p>
  
  <pre><code>    &lt;form class='simpleValidation'&gt;
          &lt;div class='fieldRow'&gt;
              &lt;label for='title'&gt;Title *&lt;/label&gt;
              &lt;input type='text' id='title' name='title' class='required'&gt;
          &lt;/div&gt;
          &lt;div class='fieldRow'&gt;
              &lt;label for='url'&gt;URL&lt;/label&gt;
              &lt;input type='text' id='url' name='url' value='http://'&gt;
          &lt;/div&gt;
          &lt;div class='fieldRow'&gt;
              &lt;label for='labels'&gt;Labels&lt;/label&gt;
              &lt;input type='text' id='labels' name='labels'&gt;
          &lt;/div&gt;
          &lt;div class='fieldRow'&gt;
              &lt;label for='textarea'&gt;Text *&lt;/label&gt;
              &lt;textarea id='textarea' class='required'&gt;&lt;/textarea&gt;
          &lt;/div&gt;
          &lt;div class='fieldRow'&gt;
              &lt;input type='submit' id='formSubmitter' value='Submit'&gt;
          &lt;/div&gt;
      &lt;/form&gt;
  </code></pre>
  
  <p>jQuery:</p>
  
  <pre><code>$(document).ready(function() {      
          var timerId  = 0;
  
          $('.required').keyup(function() {
              clearTimeout(timerId);
  
              timerId = setTimeout(function() {
                  ajaxValidation($(this));
              }, 200);
          });
      });
  
      var ajaxValidation = function (object) {
              var $this   = $(object);
              var param   = $this.attr('name');
              var value   = $this.val();
  
              $.get(
                  'inputValidation.php',
                  {'param' : param, 'value' : value },
                  function (data) {
                      if (data.status == 'OK') {
                          validateRequiredInputs();
                      } else {
                          $this.addClass('failed');
                      }
                  },
                  'json'
              );
  
              var validateRequiredInputs = function() {
                  var numberOfMissingInputs = 0;
  
                  $('.required').each(function(i) {
                      var $item = $(this);
                      var itemValue = $item.val();
  
                      if (itemValue.length) {
                          $item.removeClass('failed');
                      } else {
                          $item.addClass('failed');
                          numberOfMissingInputs++;
                      }
                  });
  
                  var $submitButton = $('#formSubmitter');
  
                  if (numberOfMissingInputs &gt; 0) {
                      $submitButton.prop('disabled', true)
                  } else {
                      $submitButton.prop('disabled', false)
                  }
              }
          }
  </code></pre>
  
  <p>PHP (inputValidation.php):</p>
  
  <pre><code>&lt;?php
  $result = array();
  
  if (isset($_GET['param'])) {
      $result['status'] = 'OK';
      $result['message'] = 'Input is valid!';
  } else {
      $result['status'] = 'ERROR';
      $result['message'] = 'Input IS NOT valid';
  }
  
  echo json_encode($result)
  ?&gt;
  </code></pre>
  
  <p>When I start typing in the <code>Title *</code> field I get the following error from the console: <code>Uncaught TypeError: Cannot read property 'toLowerCase' of undefined</code></p>
  
  <p>Note: I am using jQuery 2.2.1</p>
  
  <p>So far I have checked the code for mis-spelling but cannot find any.</p>