After ajax call, date picker work but the formatting not - php

Question

Below is the Ajax call in index.php
$(document).ready(function() {
$(document).on("click", ".result p", function(e) {
$(this).parent(".result").empty();
var $txt = $(this).text();
document.getElementById("pd").style.display = "block";
document.getElementById("listpd").style.display = "none";
e.preventDefault();
$.ajax({
type: "POST",
url: "piutang.php",
data: {"nama": $txt},
success: function(msg) {
$("#pd").html(msg)
$("#formNama").val('');
},
error: function() {
alert("failure");
}
});
});
});
The piutang.php (inside the Ajax call) has the text box for the date-picker and also the script for the date picker.
<input type="text" id="datepicker" name="tgl" style="width: 85px;" readonly />
<script>
$(function() {
$("#datepicker").datepicker();
});
$('#datepicker').datepicker({
dateFormat: "dd M yy"
}).datepicker("setDate", new Date());
</script>
After the call, inside the div with id:#pd,
I can see the text box of the date picker with the current date.
But it show the default format mm/dd/yyyy not dd M yy.
What I've tried so far is cut the script code in piutang.php,
then paste/insert the code inside Ajax success, right after $("#pd").html(msg),
but the result is the same thing, inside the div with id:#pd,
the text box show the current date with its default format mm/dd/yyyy.
How do I solve this ?
Thank you.

Answer 1

You need to initialize date picker one time with all settings:
$('#datepicker').datepicker({
dateFormat: "dd M yy"
}).datepicker("setDate", new Date());
This one is enough. Remove other one.