Show datePicker value using code

When a page loads, the datepicker element shows the placeholder greyed text “Pick a date”.
before: DatePicker-before

When a person manually selects a date using the datepicker the chosen date appears in black in the text box on the element.
after: DatePicker-after

I want the placeholder text on load, but in some cases I want to put a date in this text box using code and so it appears as if it has been selected by the user (looks like After photo).

For instance, if I wanted to display today’s date I set the value of the datepicker:
$w(“#datePicker1”).value = new Date();

But how do I get this date to also appear as black text in the datepicker text box?

Click on the element, click on design and set the color to black. You can also use the settings to set it for today’s date by default. No need to use code.

Thanks. I should have pointed out that I’m using the datepicker for selecting a course start date.

I could just set the placeholder text, but the problem is that in some cases (when there are date options) it should read “Pick a date” and in others (when a course has only one start date so no options) I want the placeholder text to show that start date, which is calculated after page load. In the latter case after the date is displayed the datepicker will be set as disabled.