Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript Object-Oriented JavaScript: Challenge Rendering the Game Rendering the Spaces, Board, and Tokens Solution

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
221,585 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
221,585 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.

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