I have written a JavaScript code to fetch JSON information. I plan on storing this JSON file locally (I downloaded an example file and added a birthdate object for my usage example from https://jsonplaceholder.typicode.com/users)
My goal is to parse the returned JSON data and display the contents in two separate divs. The JSON object that I have created is named "birthdate". In my script, I have a variable set to get today's date called "today". It displays the date as "05-12" in the console, which matches the format I have used for the "birthdate" object in the JSON. I only need the day and month.
What I aim for is to compare "today" with the "birthdate" in the JSON. If they match, I want the corresponding user entry to be displayed in the user-list-today div under the Birthday Today section of the page.
If "today" does not match the "birthdate", I want all other entries to be displayed in the user-list-future div under the Birthday Future section of the page.
Each entry should only appear in one of the sections, not both.
Any assistance offered would be highly appreciated. Below, you will find the complete code. Please note that the snippet may throw an error due to the use of a local path for the JSON file instead of an online version.
You can also view my codepen here: https://codepen.io/abc-123-webguy/pen/poegaLq
JSON file:
<pre>
[
{
"id": 1,
"birthdate": "05-12",
"name": "Leanne Graham",
"username": "Bret",
"email": "[email protected]",
...
},
{...},
{...}
]
</pre>
JS Script
...
HTML CSS Code
...