show Jquery Form Validation message Next to bootsrap Textbox

i have a form implemented using Bootstrap and now validating form using jquery validate plugin. validations are working fine but i want to show validation messages next to textbox field but currently it is showing below to my text box

here is my html code :

<div class="form-group">
  <div class="col-md-2">
   <label for="forTypeName" class="control-label">Trainer Name</label>
  </div>
  <div class="col-md-10">
    <input type="text" class="form-control" id="txtname" name="txtname">
  </div>
</div>

and my JS Code is

   var validator = $("#sjform").validate({
            rules: {
                txtname: "required"

            },
            messages: {
                txtname: "Required"
            },
            errorPlacement: function (error, element) {
            //    error.appendTo($(element).parent().next());
            error.insertAfter(element);
            },

            //highlight: function (element) {
            //    $(element).closest('.form-group').addClass('has-error');
            //},
            //unhighlight: function (element) {
            //    $(element).closest('.form-group').removeClass('has-error');
            //},
            highlight: function (element) {
                $(element).parent().removeClass('has-success').addClass('has-error');
            },
            unhighlight: function (element) {
                $(element).parent().removeClass('has-error').addClass('has-success');
            },
            errorElement: 'span',
            errorClass: 'help-block',
            submitHandler: function (form) {
                form.submit();
            }
        });

devs any help please.. thanks in advance