What’s the difference between putting script in head and body?
The time that it runs.
When I put scripts in head, the result shows 0 Shopping list
The elements you are trying to access don’t exist when the script runs (since they appear after the script in the document).
Note that you can write a script so that a function is called later (for various values of later including “when the entire document has loaded”) using event handlers.