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 Object-Oriented JavaScript: Challenge Rendering the Game Rendering the Spaces, Board, and Tokens Solution

Posted by Unsubscribed User
Unsubscribed User
5,918 Points

drawHTMLToken with jQuery

Hello! I'm trying to challenge myself to use jQuery where I can with this project. I had some difficulty with the drawHTMLToken method and am now getting an error: Uncaught TypeError: Cannot read property 'drawHTMLToken' of undefined at Game.startGame (Game.js:28)

I'm not sure if I messed up some syntax or if it has anything to do with not setting the div element to a variable, or if something else has caused this error?

I've attached my current code for drawHTMLToken and get htmlToken in case that has errors as well:

}

drawHTMLToken() {
    $('#game-board-underlay').append('<div>').attr('id', $(this).id).addClass('token');
    $('.token').css('background-color', $(this).owner.color);


}

get htmlToken(){
    return $('#$(this).id');

    }


}

Thank you!

2 Answers

Steven Parker
Steven Parker
229,744 Points
Steven Parker
Steven Parker
229,744 Points

I see the error on this line of "startGame":

        this.activePlayer.activeToken.drawHTMLToken();

But "activeToken" returns an array (from "filter"). Did you mean to apply an index?

Next, I found this in "drawHTMLToken":

        $('.token').css('background-color', $(this).owner.color);

But only "Token" objects have an "owner" property. A jQuery object would not.

There's more, but that should get you started on your debugging adventure. :wink:

Steven Parker
Steven Parker
229,744 Points
Steven Parker
Steven Parker
229,744 Points

I don't think you can do this:

    return $('#$(this).id');

That would require some kind of fancy interpolation to occur. But you probably don't need it. If you're trying to get a jQuery object that contains the element who's id is the id of "this", wouldn't that be just "$(this)"?

If you have other issues you'd like help with, please make a snapshot of your workspace and post the link to it here.

Unsubscribed User
Unsubscribed User
5,918 Points

Thanks for the feedback, that definitely makes sense. I'm still getting the Uncaught Type error though, so here it the snapshot of my workspace: https://w.trhou.se/ftsza98f26