Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Tomas Vesely
Front End Web Development Techdegree Graduate 22,316 PointsUsing Template Literal to create List Item in one line of code?
It looked to me that it is a lengthy code to add few elements so I tried to shorten it just from curiosity. I used innerHTML to add Name of Invitee, label and checkbox in one line of code. Then appended it to the ul. It looks as if it is working well.
Is it Ok to do it that way, or is there something which benefit the steps as shown?
const text = input.value;
const li = document.createElement('li');
li.innerHTML = `${text} <label>Confirmed <input type="checkbox"></label>`;
ul.appendChild(li);
1 Answer
Tomas Vesely
Front End Web Development Techdegree Graduate 22,316 PointsAfter going through the whole module I can see why was it used that way. The part of refactoring makes it much more clear now as making from that code a function to make elements like createElement( elementName, property, value) which is shown there makes it better to understand what is going on even better than the Template Literal I used.
Ashish Mehra
2,411 PointsThanks for sharing Tomas Vesely .
Ashish Mehra
2,411 PointsAshish Mehra
2,411 PointsHi Tomas Vesely,
It's totally fine according to me. I kind of prefer the same way now instead of writing create element command again and again to create seperate elements and appending each one after that.