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 trialEd Bundy
5,408 Pointsbutton doesn't work to change heading. Not finding difference in code.
const input = document.querySelector('input');
const p = document.querySelector(‘p.description’);
const button = document.querySelector(‘button’);
button.addEventListener(‘click’, () => {
p.textContent = input.value;
})
<!DOCTYPE html>
<html>
<head>
<title>JavaScript and xxxthe DOM</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<h1 id="myHeading">JavaScript and the DOM</h1>
<p>Making a web page interactive</p>
<p class="description">Things that are purple:</p>
<input type="text" class="description">
<button class="description">Change list</button>
<ul>
<li>grapes</li>
<li>amethyst</li>
<li>lavender</li>
<li>plums</li>
</ul>
<script src="app.js"></script>
</body>
</html>
PS: I have no idea why some code formats nicely in this post and the rest doesn't. Wouldn't it be cool if there was some kind of website that specialized in videos that taught things, and posted a simple video on how to get code to format well in these questions?
EDIT - ok here is the snapshot link: https://w.trhou.se/el55eohafa
Gabbie Metheny
33,778 PointsLearning Markdown is definitely worth the effort! There's a great forum post specifically on posting code to the Treehouse forum, and one here on Treehouse-flavored Markdown in general. Nick also has a video on taking a snapshot of your workspace :)
The Markdown Cheatsheet works for most simple code snippets, too!
Ed Bundy
5,408 PointsEDIT- problem solved by using mac keyboard for quote marks
1 Answer
Gabbie Metheny
33,778 PointsIt looks like you're using the wrong type of quotes for most of your strings in app.js
: you should use either standard straight single '' or double "" quotes, or even backticks ``, but you're using curly quotes ‘’ on every line except the first one. Replace those with straight single quotes, and your code should work!
Ed Bundy
5,408 PointsBefore posting, i tried replacing all of them with double quotes and it still didn't work (saving both files multiple times, refreshing multiple times, to be sure. i've not had a problem with my double quotes in the past, but it may be because I am using a microsoft bluetooth keyboard this time instead of macbook, or that I am using El Capitan this time. Will try again with the mac keyboard.
Gabbie Metheny
33,778 PointsCopying and pasting the code you posted, I was able to get it to work by changing only the quotes, so I'm not sure what else the problem might be. Since the code you posted wasn't formatted properly, it's possible there's a problem with line breaks, indentation, etc. that I can't see. I also don't know your file structure, so I'd check to make sure your app.js
and style.css
are linked correctly.
If you're getting any error messages, can you share those?
Ed Bundy
5,408 PointsYeah, when I switched to the mac keyboard and rekeyed all the quotes it worked. Thanks! Never realized the microsoft keyboard would be a problem
Gabbie Metheny
33,778 PointsThat's so strange, but I'm glad you got it working!
Abubakr Alhaj
4,297 PointsAbubakr Alhaj
4,297 PointsHi
Your code is very difficult to read :( .
I recommend you to check out Markdown course here in Treehouse
The course will help you to know how to format nicely your code and text.
Markdown Course
by the way I used to have your same issue before LOL but after the course everything changed .
Happy Coding