title: Unable to set cuctom html5 validation message
body: <p>I am trying to use browser validation messaging. I am not able to define a custom message when 2 fields are NOT identical.</p>
  
  <p>My situation is that i have to test when the field IS valid, so i used jquery <code>on.blur</code> to test, but for some reason, the message is empty.</p>
  
  <p>Try entering 2 valid but different email addresses. The expected result is supposed to be "Test why not working" has a browser message.</p>
  
  <p><a href="http://jsfiddle.net/26veA/1/" rel="nofollow">Working jsFiddle of my situation</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;form id="newsletter_form" class="form" role="form" name="newsletter_form" method="post" action="/" autocomplete="off"&gt;
      &lt;div class="row"&gt;
          &lt;div class="col-xs-12 col-sm-6 col-md-6 col-lg-6"&gt;
              &lt;input type="email" class="form-control" name="email" id="email" value="" maxlength="250" placeholder="email" aria-required="true" required="required" /&gt;
          &lt;/div&gt;
          &lt;div class="col-xs-12 col-sm-6 col-md-6 col-lg-6"&gt;
              &lt;input type="email" class="form-control" name="confirm_email" id="confirm_email" value="" maxlength="250" placeholder="confirm email" aria-required="true" required="required" /&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;input type="submit" class="btn submit btn-default" value="submmit!" /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>JAVASCRIPT:</p>
  
  <pre><code>$('form #email').on('change invalid', function () {
      var field = $(this).get(0);
      field.setCustomValidity('');
      if (!field.validity.valid) {
          field.setCustomValidity("custom email invalid");
      }
  });
  
  
  /* THIS IS MY BUGGY ONE */
  $('form #confirm_email').on('blur valid', function () {
      var field = $(this).get(0);
      field.setCustomValidity('');
      if ($("#email").val() != $("#confirm_email").val()) {
          /* i tried setting the field to invalid, nothing */
          //field.validity.invalid;
          //alert('s');
          field.setCustomValidity("test why not working");
      }
  });
  
  $('form #confirm_email').on('change invalid', function () {
      var field = $(this).get(0);
      field.setCustomValidity('');
      if (!field.validity.valid) {
          field.setCustomValidity("custom error message");
      }
  });
  </code></pre>
  
  <p>I tried jquery.on(change valid  .. and so on, i get the <code>alert()</code> bot not the changed text.</p>
  
  <p>Any help will be appreciated, i am getting bored of this 'bug'?</p>