Tell us what’s happening:
I can’t seem to see what I did wrong. I put all the template literals in their proper places, the labels are also within the template literal, as well as I double checked any spacing errors or misspelled variables but nothing is working.
Your code so far
<!-- file: index.html -->
/* file: styles.css */
/* file: script.js */
// User Editable Region
function addEntry() {
const targetInputContainer = document.querySelector(`#${entryDropdown.value} .input-container`);
const entryNumber = targetInputContainer.querySelectorAll('input[type="text"]').length;
const HTMLString = `
<label for="${entryDropdown.value}-${entryNumber}-name">Entry ${entryNumber} Name</label>
<input type="text" id="${entryDropdown.value}-${entryNumber}-name" placeholder="Name" />
<label for="${entryDropdown.value}-${entryNumber}-calories"> Entry ${entryNumber} Calories</label>`;
}
// User Editable Region
Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.4 Safari/605.1.15
Challenge Information:
Learn Form Validation by Building a Calorie Counter - Step 49