How to put day of week?

[ThatOneCoder]

Hi, I am trying to put the day of week onto my Versa watch face, but I can't seem to find a tutorial on how to do it or even how to really code in JavaScript. I've gone through the first "getting started" tutorial and looked through the rest of the things in the glossary, guides, and online on other websites. A little push in the right direction or some help on the code would be greatly appreciated.

[JonFitbit]

You can have an array of day names and the javascript getDay() method:

const dayLabel = document.getElementById("dayLabel");
let today = new Date(); // or get this from the tick event (evt.date)
const days = ["SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"];
let dayName = days[today.getDay()];
dayLabel.text = dayName;

[ThatOneCoder]

Ok, so i put those into the index.js file and its still not working. I put some code (or at least what i thought was the right code) into the index.gui and the styles.css file too because I thought that would be what I would do. It keeps giving me a error message "Error 22 Unclosed element 'image'" which when i go to it brings me to the index.gui file(resources/index.gui:8,1).

<svg> 
     <image href="op1.jpg">
       <text id="myLabel"></text>
         <text id="myMonth" />
  <text id="myDay" />
  <text id="dayofWeek"/>
</svg> 
  

op1.jpg is my background. Why would that be giving me a error out of all of the code? I'll attach my other code so you can see if there is a error in it or not.

Spoiler

import clock from "clock";
import document from "document";
import { preferences } from "user-settings";
import * as util from "../common/utils";
let today = new Date();

// Update the clock every minute
clock.granularity = "minutes";

// Get a handle on the <text> element
const myLabel = document.getElementById("myLabel");
const myMonth = document.getElementById("myMonth");
const myDay = document.getElementById("myDay");
const dayofWeek = document.getElementById("dayofWeek");

// Update the <text> element every tick with the current time
clock.ontick = (evt) => {
  let today = evt.date;
  let hours = today.getHours();
  let monthnum = today.getMonth();
  let day = today.getDate();
  var month = new Array();
  month[0] = "January";
  month[1] = "February";
  month[2] = "March";
  month[3] = "April";
  month[4] = "May";
  month[5] = "June";  
  month[6] = "July";
  month[7] = "August";
  month[8] = "September";
  month[9] = "October";
  month[10] = "November";
  month[11] = "December";
let monthname = month[monthnum];
 
  const days = ["SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"];
  let dayName = days[today.getDay()];

  if (preferences.clockDisplay === "12h") {
    // 12h format
    hours = hours % 12 || 12;
  } else {
    // 24h format
    hours = util.zeroPad(hours);
  }
  let mins = util.zeroPad(today.getMinutes());
  myLabel.text = `${hours}:${mins}`;
  myMonth.text = `${monthname}`;
  myDay.text = `${day}`;
  dayofWeek.text = `${dayName}`;
}

[ThatOneCoder · Accepted solution]

Update: I figured out the error and fixed it, but it still won't show up. What else is there to do for this? I think the problem isn't wrong in terms of an error but just isn't being completed and showing up.

Update: Never mind comic sans wasn't a font I could use and that screwed everything up