How do I center, change the color and font of this string?

December 16, 2021

I don’t know the first thing about coding or development, so if somebody could just re-paste my code with the corrections included that would be incredibly helpful. I am adding a current date widget to my website, but have no ability to center it, change the font color to white or change the font at all. Could somebody help me?

Here is the code I’m using in full:

let date = new Date();
let day = String(date.getDate());
let weekday = date.getDay();
let month = date.getMonth();
let year = String(date.getFullYear());
const monthNames = ["January", "Febuary", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
const weekdays = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]
month = monthNames[month];
weekday = weekdays[weekday]
let fullDate = (weekday + " " + day + ", " + month + ", " + year);
document.write(fullDate);

>Solution :

Like this

Note I wrapped the script in a page load event

Change document.body.innerHTML += to for example

document.getElementById("myDateContainer").innerHTML =

if you have somewhere else to put it

myDateContainer could be <div id="myDateContainer"></div> somewhere on your page

<!doctype html>
<html>

<head>
  <title>Some title</title>
  <style>
    .date {
      display: table;
      margin: 0 auto;
      color: red;
      font-family: Arial, Helvetica, sans-serif;
    }
  </style>
  <script>
    window.addEventListener("load", function() {
      let date = new Date();
      let day = String(date.getDate());
      let weekday = date.getDay();
      let month = date.getMonth();
      let year = String(date.getFullYear());
      const monthNames = ["January", "Febuary", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
      const weekdays = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]
      month = monthNames[month];
      weekday = weekdays[weekday]
      let fullDate = (weekday + " " + day + ", " + month + ", " + year);
      document.body.innerHTML += `<span class="date">${fullDate}</span>`;
    })
  </script>
</head>

<body>
</body>

</html>