## How to make a countdown to every 1st of the month?

I have a countdown timer on my site and want it to countdown to the 1st of each month at 12:00, at 12:01 I need the timer to reset and countdown to the following 1st of the month.

I am currently using the following script which is from w3schools which works a treat but I don’t want to keep setting the date every month, I have looked though some similar questions on here to try and modify this script myself but I can’t seem to get it to work. Can someone here give me some guidance please.

<!-- Display the countdown timer in an element -->
<p id="demo"></p>

<script>
// Set the date we're counting down to
var countDownDate = new Date("Jun 1, 2017 12:00:00").getTime();

// Update the count down every 1 second
var x = setInterval(function() {

// Get todays date and time
var now = new Date().getTime();

// Find the distance between now an the count down date
var distance = countDownDate - now;

// Time calculations for days, hours, minutes and seconds
var days = Math.floor(distance /  (1000 * 60 * 60 * 24));
var hours = Math.floor((distance % (1000 *  60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((distance  % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance  % (1000 * 60)) / 1000);

// Display the result in the element with id="demo"
document.getElementById("demo").innerHTML = days + "d " +  hours + "h "
+ minutes + "m " + seconds + "s ";

// If the count down is finished, write some text
if (distance < 0) {
clearInterval(x);
document.getElementById("demo").innerHTML  = "EXPIRED";
}
}, 1000);
</script>

Read more here: How to make a countdown to every 1st of the month?