Bug in step 7?


#1

I’m trying to figure out what could possibly be wrong with this code for toggling the “highlighted” class on the div “text”. the code works for toggling the text just fine but submitting gives me the
"Oops, try again. Did you replace your .addClass() with a .toggleClass()?"

Any thoughts?

https://www.codecademy.com/courses/web-beginner-en-v6phg/1/2?curriculum_id=50a3fad8c7a770b5fd0007a1



$(document).ready(function() {
    $(text).click(function() {
        $(text).toggleClass("highlighted");
    });
});


#2

text is currently an undefined variable? Selecting elements requires strings:

"text"

remember that if you want to select an element by id, the selector should start with a number sign


#3

Nope, I tried I absolutely every variation of “text”, “#text”. ect The code works in the box to the right in nearly every setup and I only finally got past using $(this) for the toggle class. My point is the exercise makes the window work for highlighting in nearly all examples but only passes when I used a different selector…Think It might need some work.


#4

text is an id selector, using $("text") would select <text></text> element, which we do not have, how do we target elements by id using jquery?


#5

Ok text was an ID in the HTML which is why the script works on the page. also then please explain to me the presence of this instruction on the step immediately preceding this one where we learned to assign .addClass

Remember: You aren’t selecting anything, you are modifying your element. This means that you do not need # or . before your class.


#6

this concerns addClass and toggleClass:

toggleClass("highlighted")

see, now . or # or needed given we add a class, however when selecting an element by id we still need the number sign (#)


#7

Like this?


#8

yes, but on line 3 use $("#text") as well, or $(this)


#9

or like this?


#10

seriously? $("text") will select <text></text> element, which we do not have

we select by id, which requires a number sign in the selector


#11

ok then please help me understand what was the meaning of the instruction of the previous step that told me specifically not to use # or . i’m not understanding the difference they were trying to declare and my inclination was to use # but I was instructed otherwise


#12

no, need for using # or . when using function like addClass or toggleClass given there tasks involves classes only, so there is no need to distinquish between element, id and class

when selecting anything using: $(selector), you need to distinquish between element, class and id, so you need to use # when selecting element by id, and . when selecting elementy by class. Its even in the instructions:

Remember: You aren’t selecting anything

not selecting anything applies to addClass and toggleClass, $() is still selecting like you learned

thing we learned don’t change all of a sudden, the new explanation only involved the function you learned. Not selecting, which you already knew, that didn’t change


#13

sorry I had been Typing my reply when you reply to my last post. I’m understanding what you are saying about using the text selector by ID. That statement was only intended to refer to addClass and toggleClass what confused me is that I passed the previous step with this code which seems like it shouldn’t have worked then.

    $('#text').click(function() {
        $(text).addClass('highlighted');
    });
});

Why is text acceptable here then? or should it have always been "#text"


#14

here:

$(text).addClass('highlighted');

the two accetable answer are "#text" and this, not sure why it let you pass now


#15

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.