| Level Navigation: 1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
Current Level: 9 |
10 |
🎯 Challenge Part 2: Add a Second City Button (Same Page)
Goal: Add a second city button to the same page, allowing users to switch between cities.
📋 What You’ll Do
- Add a second button to your HTML for a different city (like Atlanta)
- Add weather data for the second city as a new POJO in your script
- Create a second event listener that displays the second city’s weather in the same card
🚀 Challenge Instructions
Work in the same index.html and script.js files:
- Add a second button to your HTML for a different city (like Atlanta)
- Add weather data for the second city as a new POJO in your script
- Create a second event listener that displays the second city’s weather in the same card
Important: Don’t create a second card! Use the same card HTML and just change the data when different buttons are clicked.
Challenge: Implement this yourself! You’ll need to:
- Create a second button with a unique ID
- Add weather data for another city
- Set up another
onEvent() listener
- Make sure both buttons update the same card elements
💡 What You’ll Learn
- Multiple event listeners on the same page
- Reusing DOM elements for different data
- Managing multiple data sources
- Dynamic content switching
✅ Check Your Work
🔗 Navigation
Ready for the final challenge? Continue to Challenge Part 3: Multiple City Buttons
| Level Navigation: 1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
Current Level: 9 |
10 |