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 Selecting Elements and Adding Events with JavaScript Perform: Selecting Elements

Radha Bhambwani
Radha Bhambwani
10,182 Points

Using firefox console instead of chrome's

I'm trying to use the firefox console or with the firebug add-on. But somehow all the variables are showing up as undefined, while chrome's console shows exactly what I expect it to. Can anyone please tell me why the firefox console is being picky? Here's my code:

var taskInput = document.getElementById("new-task"); //new-task
var addButton = document.getElementsByTagName("button")[0];//first button
var incompleteTasksHolder = document.getElementById("incomplete-tasks"); //incomplete-tasks
var completedTasksHolder = document.getElementById("completed-tasks"); //completed-tasks

2 Answers

Christopher Crouch
Christopher Crouch
11,992 Points

Sorry this might not be the most helpful answer, but it seems to be working ok on this end. I'm going to the course linked on the right side of the screen, opening the workspace for that video, viewing in Firefox and entering the following in the Firebug console:

var taskInput = document.getElementById("new-task"); //new-task
var addButton = document.getElementsByTagName("button")[0];//first button
var incompleteTasksHolder = document.getElementById("incomplete-tasks"); //incomplete-tasks
var completedTasksHolder = document.getElementById("completed-tasks"); //completed-tasks

console.log( taskInput );
console.log( addButton );
console.log( incompleteTasksHolder );
console.log( completedTasksHolder );

This is what I'm getting back:

<input id="new-task" type="text">
<button>
<ul id="incomplete-tasks">
<ul id="completed-tasks">

Do they come up as undefined for you with console.log?

Radha Bhambwani
Radha Bhambwani
10,182 Points

That definitely helps! Actually, I realized what the mistake was. It was because I forgot to refresh the browser after writing more code in sublime. I thought that reopening the console automatically refreshes the browser.. Such a silly mistake! Thanks for your help though!