forumPosts2

function solve() {
    let [title, category, content, btnPublish] = document.querySelectorAll(
        '#post-title, #post-category, #post-content, #publish-btn'
    );

    let [ulReview, ulPublished, btnClear] = document.querySelectorAll(
        '#review-list, #published-list, #clear-btn'
    );

    btnPublish.addEventListener('click', (e) => {
        e.preventDefault();
        if ([title, category, content].some((e) => e.value == '')) {
            return;
        }
        let [titleValue, catValue, contentValue] = [
            title.value,
            category.value,
            content.value,
        ];
        let li = document.createElement('li');
        li.className = 'rpost';
        li.innerHTML = `<article>
        <h4>${titleValue}</h4>
        <p>Category: ${catValue}</p>
        <p>Content: ${contentValue}</p>
        </article>
        <button class = "action-btn edit">Edit</button>
       <button class = "action-btn approve">Approve</button> `;
        let [btnEdit, btnApprove] = li.querySelectorAll('button');
        ulReview.appendChild(li);
        [title, category, content].forEach((e) => (e.value = ''));

        btnEdit.addEventListener('click', () => {
            [title, category, content].forEach(
                (e, i) => (e.value = [titleValue, catValue, contentValue][i])
            );
            ulReview.removeChild(li);
        });
        btnApprove.addEventListener('click', () => {
            ulPublished.appendChild(li);
            li.removeChild(btnEdit);
            li.removeChild(btnApprove);
        });
    });
    btnClear.addEventListener('click', () => {
        ulPublished.innerHTML = '';
    });
}