If you wish to allow accent (see RFC 5322) and allow new domain extension like .quebec. use this expression:
/\b[a-zA-Z0-9\u00C0-\u017F._%+-]+@[a-zA-Z0-9\u00C0-\u017F.-]+\.[a-zA-Z]{2,}\b/
$(document).ready(function() {_x000D_
var input = $('.input_field');_x000D_
var result = $('.test_result');_x000D_
var regExpression = /\b[a-zA-Z0-9\u00C0-\u017F._%+-]+@[a-zA-Z0-9\u00C0-\u017F.-]+\.[a-zA-Z]{2,}\b/;_x000D_
_x000D_
$('.btnTest').click(function(){_x000D_
var isValid = regExpression.test(input.val());_x000D_
if (isValid)_x000D_
result.html('<span style="color:green;">This email is valid</span>');_x000D_
else_x000D_
result.html('<span style="color:red;">This email is not valid</span>');_x000D_
_x000D_
});_x000D_
_x000D_
});
_x000D_
body {_x000D_
padding: 40px;_x000D_
}_x000D_
_x000D_
label {_x000D_
font-weight: bold;_x000D_
}_x000D_
_x000D_
input[type=text] {_x000D_
width: 20em_x000D_
}_x000D_
.test_result {_x000D_
font-size:4em;_x000D_
}
_x000D_
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>_x000D_
<label for="search_field">Input</label>_x000D_
<input type='text' class='input_field' />_x000D_
<button type="button" class="btnTest">_x000D_
Test_x000D_
</button>_x000D_
<br/>_x000D_
<div class="test_result">_x000D_
Not Tested_x000D_
</div>
_x000D_