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 jQuery Basics (2014) Creating a Simple Lightbox Creating and Appending Detached DOM elements

Carl Conroy
Carl Conroy
8,677 Points
Posted by Carl Conroy
Carl Conroy
8,677 Points

Not understanding this code challenge on the .append(); function

I'm not quite sure how to solve this problem. I believe the objective is to get the "Dismiss" button to overlay the message displayed in the modal?

When I code incorrectly the message " Bummer! The last element in the modal is the placeholder, not the button. Did you use append() to append the button to the modal?" appears.

I have tried adding the .append(#$dismissButton) to different parts of the code to get the Dismiss button to appear.

It has appeared but not in the manner which I believe this challenge calls for.

Any help in understanding this better would be greatly appreciated.

1 Answer

Kristopher Van Sant
PLUS
Kristopher Van Sant
Courses Plus Student 18,830 Points
Kristopher Van Sant
Kristopher Van Sant
Courses Plus Student 18,830 Points

The challenge is asking you to add the Dismiss button to the modal so that you can dismiss or close the modal. The modal currently isn't showing the dismiss button. The hint for fixing the problem is in the app.js.

Here is where the dismiss button is created. The comment also says we need to attach it to the modal, so this is where we would use the append method.

//Create a button to dismiss modal and att it to modal
var $dismissButton = $("<button>Dismiss</button>");

So underneath the above code is where we would want to append $dismissButton to the modal. 

//Create a button to dismiss modal and att it to modal
var $dismissButton = $("<button>Dismiss</button>");
$modal.append($dismissButton);

Hope this helps!