javascript - Jquery form element access -

i'm new jquery , trying following:

i have form:

<form method="post" class="add-product" > ... <label name="message"></label> ... </form> 

and script:

$(document).ready(function() { $(".add-product").submit(function(e) {     e.preventdefault();     var form = this;     $.ajax({         type: "post",         url: "/product/add/",         data: $(this).serialize(),         success: function(data) {             $(form.elements["message"]).html(data.message);         }     }); }); 

});

i'm trying update label message, doesn't work. seems have mistake in syntax:

$(form.elements["message"]).html(data.message); 

the issue because label not appear in form.elements collection. instead need select directly:

$(".add-product").submit(function(e) {    e.preventdefault();    var form = this;      // inside ajax callback...    var data = {      message: 'foo bar'    }    $(form).find('label[name="message"]').html(data.message);  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <form method="post" class="add-product">    <label name="message"></label>      <button>submit</button>  </form>