Learn Form Validation by Building a Calorie Counter - Step 50

JavaScript
1

Tell us what’s happening:

Entry ${entryNumber} Calories

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 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36

Challenge Information:

Learn Form Validation by Building a Calorie Counter - Step 50

2

@ewesson86 What kind of issue are you currently facing?

3

The rest of your html is inside the tick marks

You are on the right track, and the html itself passes but should the the html be outside of your code in a js file?