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
Marie Urbina
7,168 PointsJQuery Basics - create a select and append to menu
Why can't I get this select option up?? Please help.
//create a select and append to menu
var $select = $("<select></select>");
$("#menu").append($select); ```
4 Answers
Steven Parker
229,732 PointsThere's nothing obviously wrong here, it's hard to identify the issue without seeing the other code that goes with this (at least some HTML), but here's a few things to check:
- make sure you have an element with an ID of "menu" on the page
- make sure that the "menu" element is a kind that can have
selectelements as direct children - check that the jQuery library is being loaded before this script executes
If you still need help, you can facilitate a complete analysis by showing the complete code, or you can make a snapshot of your workspace and post the link to it here. It's also helpful to provide a link to the course page you are working with.
Marie Urbina
7,168 PointsOK, I was trying to isolate the problem. I tried to move the 'menu' ID from the div to the <ul> in the html, but no luck Thanks for any help.
https://teamtreehouse.com/library/jquery-basics/creating-a-mobile-drop-down-menu/perform-part-1
Steven Parker
229,732 PointsYou definitely don't want to put the id of "menu" on the ul, lists can only have li elements as children.
The issue seems to be the unterminated block comment that begins on line 8 of app.js. When I completed the comment by adding a line at the bottom with "*/" on it, the script started working.
Marie Urbina
7,168 PointsThank you. I closed that comment as you did. Mine is not yet working. What do you mean, the id "menu" should have select elements as direct children? I thought it went on the div wrapper around the <ul>, like in the example? Do I need to refactor this html code?
Is it possible this is a Treehouse bug, because the title in my screen is jQuery Basics-Plan, and not Mobile Drop Down Menu, as shown on the screen in the video?
Steven Parker
229,732 PointsIn your first snapshot, the id "menu" is on the ul, and ul elements should only have li elements as children. And li elements are list items (not select elements).
In the new snapshot, I see the id has been moved to the div, where appending the select is appropriate. But on lines 19 and 20 of index.html, two different versions of jQuery are being loaded. Either version will work, but pick one and remove the other.
Other than that, the code seems OK, and in fact worked when I tested it.
And you can change the title of the workspace using the Workspaces page.
Marie Urbina
7,168 PointsThanks for looking. I took out the script on 19. It's still not working here for me. Still pretty confused here. Thanks for any help.
Steven Parker
229,732 PointsNow when I open the preview on your workspace, the select box is clearly visible. In fact, it displaces the page heading.
I'm confused about why you're not seeing it. Have you restarted your browser?