Learn Form Validation by Building a Calorie Counter - Step 49

JavaScript
1

Tell us what’s happening:

Please help me with the following step. I have added the label element correctly as it was mentioned and yet there is an error saying that I have modified my existing code. Kindly tell me what I am doing wrong.

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"></input>
    <label for="${entryDropdown.value}-${entryNumber}-calories">Entry ${entryNumber} Calories</label>`;
}

// User Editable Region

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36

Challenge Information:

Learn Form Validation by Building a Calorie Counter - Step 49

2

Don’t change the given code.

The ‘input’ element doesn’t have the closing tag, and after the “Name” in the same line you should leave what is given by default in the challenge.

3

I have done as it as and yet the code is not working. Can you give me the correct code.

4

Post the code here. Giving the final solutions is not practiced on this forum.