как сделать ссылки вперед и назад, позволяющие менять месяц
я совсем запутался с календарем, не понимаю, каким образом осуществить следующее: сделать ссылки вперед и назад позволяющие менять месяца, месяц и год выводимые над календарем, должны соответствовать отображаемому месяцу. как-то тяжело идет с подобными задачами, уже часа два смотрю и не могу сделать.
'use strict';
// Линейный календарь на JavaScript
let september = document.querySelector('#september');
let div = document.querySelector('#month');
let date;
let day;
for (let i = 1; i <= 30; i++){
let li = document.createElement('li');
li.textContent += i;
september.append(li);
september.classList.add('ul');
li.classList.add('dinl');
date = new Date();
day = date.getDate()
if (+li.textContent === day){
li.style.color = 'red';
}
}
let months = [
'янв', 'фев', 'мар', 'апр', 'май', 'июн',
'июл', 'авг', 'сен', 'окт', 'ноя', 'дек'
];
let monst = date.getMonth()
let p = document.createElement('p');
p.textContent += months[monst];
div.appendChild(p)
let year = date.getFullYear();
p.textContent += ' ' + year;
.ul{
list-style-type: none;
padding-left: 0;
margin-left: 0;
}
.dinl{
display: inline;
margin-left: 10px;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="css/style.css" />
<title>Document</title>
</head>
<body>
<div id="month"></div>
<ul id="september">
</ul>
<script src="js/app.js"></script>
</body>
</html>