function solve() { console.log('hellothere!'); let creatorInput = document.getElementById("creator"); let titleInput = document.getElementById("title"); let categoryInput = document.getElementById("category"); let contentTextarea = document.getElementById("content"); let postsSection = Array.from(document.getElementsByTagName("section"))[1]; let archSection = Array.from(document.getElementsByClassName("archive-section"))[0]; let ol= document.querySelector("ol"); console.log(ol) console.log(postsSection); console.log(archSection); let createBtn = Array.from(document.getElementsByClassName('btn create'))[0]; console.log(creatorInput, titleInput, categoryInput, contentTextarea, createBtn); createBtn.addEventListener("click", createArticle); function createArticle(e) { e.preventDefault(); console.log('create clicked'); let creator = creatorInput.value; let title = titleInput.value; let category = categoryInput.value; let content = contentTextarea.value; let artObj={creator,title,category,content} console.log(creator, title, category, content); let newArt = document.createElement("article"); let titleH = document.createElement("h1"); titleH.textContent = title; let categoryP = document.createElement("p"); categoryP.textContent = "Category: "; let strCategory = document.createElement("strong"); strCategory.textContent = category; categoryP.appendChild(strCategory); let creatorP = document.createElement("p"); creatorP.textContent = "Creator: "; let strCreator = document.createElement("strong"); strCreator.textContent = creator; creatorP.appendChild(strCreator); let contentP = document.createElement("p"); contentP.textContent = content; let buttonsDiv = document.createElement("div"); buttonsDiv.className = "buttons"; let delBtn = document.createElement("button"); delBtn.classList.add("btn"); delBtn.classList.add("delete"); delBtn.textContent = "Delete"; delBtn.addEventListener("click", () => { delThis(newArt) }); let archBtn = document.createElement("button"); archBtn.classList.add("btn"); archBtn.classList.add("archive"); archBtn.textContent = "Archive"; archBtn.addEventListener("click", () => { archThis(newArt,artObj) }); buttonsDiv.appendChild(delBtn); buttonsDiv.appendChild(archBtn); newArt.appendChild(titleH); newArt.appendChild(categoryP); newArt.appendChild(creatorP); newArt.appendChild(contentP); newArt.appendChild(buttonsDiv); postsSection.appendChild(newArt); } function delThis(art) { art.remove() } function archThis(art,obj) { console.log(art); console.log(obj); let archLi=document.createElement("li"); archLi.textContent=obj.title; ol.appendChild(archLi); sortArts(); art.remove() } function sortArts(){ let lis=Array.from(ol.querySelectorAll("li")); lis.sort((a,b)=>a.textContent.localeCompare(b.textContent)); lis.forEach(l=>{ ol.appendChild(l) }) } }