Change HTML default input datetime format

input_datetime_format.css

input.datetime {
    position: relative;
    width: 158px;
    height: 38px;
    color: white;
}

input.datetime:before {
    position: absolute;
    top: 8px;
    left: 5px;
    content: attr(data-date);
    display: inline-block;
    color: black;
}

input.datetime::-webkit-datetime-edit, input.datetime::-webkit-inner-spin-button, input.datetime::-webkit-clear-button {
    display: none;
}

input.datetime::-webkit-calendar-picker-indicator {
    position: absolute;
    top: 8px;
    right: 5px;
    color: black;
    opacity: 1;
}

input_datetime_format.html

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/moment.min.js"></script>
<input type="date" data-date="" data-date-format="DD/MM/YYYY" value="2020-08-29">

input_datetime_format.js

$("input").on("change", function() {
    this.value !== '' && this.setAttribute(
        "data-date",
        moment(this.value, "YYYY-MM-DD")
        .format( this.getAttribute("data-date-format") )
    );
}).trigger("change");