$.ajax() error to return value [object HTMLInputElement]

Question

Every process of receiving data from the input-field and send to data base is picking up normally. When i try to get data after send to data base i'm getting a error [object HTMLInputElement] .

When i change the return mode from text to html it returns the data effectively this data comes together with input-field you can check this on print-screen below;

The arrows in red represent of border-bottom of input-field.

$(document).ready(function () {
        $('#publish-sell').click(function () {
            var payload = {
                nameClient: $('#nameClient').val(),
                nameFantasySell: $('#nameFantasySell').val(),
                addresOfClientSell: $('#addresOfClientSell').val(),
                annotations: $('#annotations').val(),
                neighborhood: $('#neighborhood').val(),
                cep: $('#cep').val(),
                phoneLandline: $('#phoneLandline').val(),
                cellphone: $('#cellphone').val(),
                autocompleteBusinessReseller: $('#autocompleteBusinessReseller').val(),
                amountProduct: $('#amountProduct').val(),
                productSoldSell: $('#productSoldSell').val(),
                producFinalPrice: $('#producFinalPrice').val(),
                registeredDaySell: $('#registeredDaySell').val()
            };
            $.ajax({
                url: "/product/sell-sucess",
                type: "POST",
                contentType: "application/json",
                processData: false,
                data: JSON.stringify(payload),
                complete: function (data) {
                  $("#printReceipt").click(function () {
                    $("#nameClientReciept").html(nameClient);
                  });
                }
            });
        });
    });

This my output result.

<h2 class="left-align white-text person-name" id="nameClientReciept"></h2>

Answer 1

There is no variable named nameClient , what you've got is a property of an object, ie it would be payload.nameClient .
However your code indicates that there is an element with that ID

nameClient: $('#nameClient').val(),

When you just do

$("#nameClientReciept").html(nameClient);

What you're really doing is

$("#nameClientReciept").html(window.nameClient);

And that is indeed an element, as elements are added as properties to the global object, based on their name/id.
What you wanted was probably just

$("#nameClientReciept").html(data);

As a sidenote, you shouldn't put event handlers inside event handlers, like you're doing.