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

JavaScript Interactive Web Pages with JavaScript Traversing and Manipulating the DOM with JavaScript Perfect

Code not working in Firefox

var listItem = createNewTaskElement(taskInput.value);

in the line above, taskInput.value is passed as argument and taskInput itself is a variable that takes element of input this works fine in chrome, but getting value from taskInput will fail in firefox. i hope somebody has solution for this

Chris Shaw
Chris Shaw
26,676 Points

Hi Stephen,

Could you please explain a bit more what happens in Firefox compared to Chrome as it's very difficult to tell from just one line of code, also could you please post the rest of your code.

https://teamtreehouse.com/forum/posting-code-to-the-forum

Ken Alger
Ken Alger
Treehouse Teacher

Stephen;

I was able to view this entire project in FIrefox, with the exception of innerText in the Modifying Elements section, which Mr. Chalkley now addresses in the Teacher's Notes. Other than that everything worked great.

Which version of Firefox are you running?

Ken

5 Answers

Sean T. Unwin
Sean T. Unwin
28,690 Points

Hi Stephen,

With regards to Ken Alger's statement, the teacher's notes he is referring to is found on the Perform: Modifying Elements page. This thread may also be of some assistance in regards to innerText and workarounds.

var taskInput = document.getElementById("new-task"); //new-task

// later in some function, the taskInput.value is passed as argument to a function called "createNewTaskElement" var listItem = createNewTaskElement(taskInput.value);

// now in chrome, whatever input value we type can be taken from the input field - but this is not the case in firefox

Dear Ken, my firefox version is 32.0.3 you can view the project in firefox - but have you tried entering some text in the taskInput field at the very top and click the add button ? the newly created <li> element including the children with it will be generated and appended into "incompleteTasksHolder" but it will be empty in firefox ( otherwise will have our entered text appended in chrome )

Ken Alger
STAFF
Ken Alger
Treehouse Teacher

Stephen;

I just looked at the application again on my system Firefox 32.0.3, and everything is working exactly like it does in Chrome and IE. It has been about a month since I worked through this project, but I don't recall adding anything additional to the project code.

Ken

Ken,

I'm not sure where to post this exactly, but as of Firefox v35.0.1 this isn't working. I've been reading various posts about the use of innerText versus innerHTML and more. I enjoyed the course - I'm struggling with fixing - or, understanding the "final" fix. Is it only an instance of this? I see it's a noted bug in the latest release - or as I've read earlier it's also not supported.

Bottom line, I'm just trying to learn the fix/edit so it will work cross-browser.

Any help/direction would be appreciated.

Thanks, Travis

Dear Ken, thanks for trying to help, but i dont think it would work the same way in firefox and i must thank Sean also for this, innerText -> must be replaced with textContent -> for firefox so i guess the problem does not lie with failure to extract .value from an element but failure to assign new value to an element with innerText on firefox ( must use textContent ) thanks again guys for taking the time to check my questions cheers