cant seem get this button to work I can create it but it wont function am I missing something?

Hi Adam. When posting code in this forum, please follow the guidelines shown in the Markdown Cheatsheet, a link for which can be found at the bottom of this post, just next to where you enter your submission. For ease of reading, I have posted your code below.

const toggleList=document.getElementById("toggleList"); 
const listDiv=document.querySelector(".list"); 
const descriptionInput=document.querySelector('input'); 
const descriptionP=document.querySelector('p.description'); 
const descriptionButton=document.querySelector('button.description'); 
const addItem=document.querySelector('input.addItem'); 
const addItemButton=document.querySelector('button.addItemButton');

toggleList.addEventListener('click',() => {
            if(listDiv.style.display=='none'){ 
                toggleList.textContent='hide list';
                listDiv.style.display='block';
            } else { toggleList.textContent='show list';
            listDiv.style.display='none'; }
});

descriptionButton.addEventListener('click', () => {
            descriptionP.innerHTML=descriptionInput.value + ':';
            p.title='list description';
});

addItemButton.addEventListener('click',() => { 
            let ul=document.getElementsByTagName('ul');
            let li=document.createElement('li');
            li.textContent=addItemInput.value;
            ul.appendChild(li);
            addItemInput.value="";
});

Above is your app.js file and I have my own index.html file from the same lesson.

1: You will find it helpful if you open your browser Javascript devtools console (e.g. F12 in Chrome). As you say, when you try to add a 5th item, nothing happens. But if you look at the console, it reports...

app.js:25 Uncaught ReferenceError: addItemInput is not defined at HTMLButtonElement.addItemButton.addEventListener (app.js:25)

(This is 25 for me, but you may have formatted your own code differently so will see a different number).

Sure enough, at line 25 of your app.js file, this is your troubled line of code

li.textContent=addItemInput.value;

Issue: addItemInput has not yet been declared.

Solution: Add this line to the other variable declarations at the top of your file.

const addItemInput = document.querySelector('input.addItemInput');

2: But now, if you try and add a fruit, we encounter another problem in the console.

Uncaught TypeError: ul.appendChild is not a function at HTMLButtonElement.addItemButton.addEventListener (app.js:27)

There is indeed a problem affecting this line...

ul.appendChild(li);

...but the root cause is actually with the declaration of 'ul' 3 lines above. As it is currently written, calling 'ul' will actually retrieve the whole 'HTMLCollection' object, but what we want is simply the first array which contains the 4 fruit and their html tags. So all we need to do is add [0] to your current declaration.

let ul=document.getElementsByTagName('ul')[0];