javascript - jQuery code that doesn`t work on WordPress -

i have contact form submit via jquery. works on html/php/js template, when use on wordpress doesn't work fine.

the form submited, jquery code inside submit function doesn't exit. doesn't retrieve error loader doesn`t appear , jquery validation doesn't occurs:

<form method="post" action="<?php echo get_template_directory_uri() . '/templates/contact.php' ?>" name="contactform" id="contactform">                 <div class="col-sm-6">                     <fieldset>                         <input name="name" type="text" id="name" size="30" value="" placeholder="name" />                         <br />                         <input name="email" type="text" id="email" size="30" value="" placeholder="email" />                         <br />                         <input name="phone" type="text" id="phone" size="30" value="" placeholder="phone" />                         <br />                     </fieldset>                 </div>                 <div class="col-sm-6">                     <fieldset>                         <textarea name="comments" cols="40" rows="8" id="comments" placeholder="message"></textarea>                         <button type="submit" class="btn btn-green-border btn-lg" id="submit" value="submit">send message</button>                     </fieldset>                 </div>             </form> 

this jquery:

// send email      jquery('#contactform').submit(function ($) {          var action = $(this).attr('action');          $("#message").slideup(750, function () {             $('#message').hide();              $('#submit')                 .after('<img src="images/loader.gif" class="loader" />')                 .attr('disabled', 'disabled');              $.post(action, {                     name: $('#name').val(),                     email: $('#email').val(),                     phone: $('#phone').val(),                     comments: $('#comments').val(),                     verify: $('#verify').val()                 },                 function (data) {                     document.getelementbyid('message').innerhtml = data;                     $('#message').slidedown('slow');                     $('#contactform img.loader').fadeout('slow', function () {                         $(this).remove()                     });                     $('#submit').removeattr('disabled');                     if (data.match('success') != null) $('#contactform').slideup('slow');                  }             );          });          return false;      }); 

what can problem?

    jquery('#contactform').submit(function ($) { 

try removing $ in function()

    jquery('#contactform').submit(function () {