I have a loop that creates an element of each day for the next 7 days and shows the weather data for the specific date. (getting the data from API). I can't figure out how to insert in each loop the date for the day. The date should be in the span
element with the id of "daily-weather"
The date format I'm trying to achieve is: "Sun" "Jan 31"
dataWeakly.daily.forEach((day, index) => {
const uvIndex: string = Math.floor(+day.uvi).toString();
if (index < 1) {
return;
}
const markup = `
<div class="weather-daily">
<span id="daily-date"></span>
<span id="daily-date"></span>
<img id="daily-img" src=http://openweathermap.org/img/wn/${
day.weather[0].icon
}@2x.png alt="weather img"></img>
<span>${toTitleCase(day.weather[0].description)}</span>
<span id="max-weather">${formatNumber(
day.temp.max
)}°c\u00A0\u00A0</span><span id="min-weather">\u00A0${formatNumber(
day.temp.min
)}°c</span>
<span>UV:\u00A0</span> <span id="uv-index">${uvIndex}</span>
</div>
`;
document
.getElementById("weekly-result-container")
.insertAdjacentHTML("afterbegin", markup);