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
Brandon Jepson
7,018 PointsJquery-get html from span not working????
I want to get the inside html from the span with class "score" (the '0') so i can update it (for a a quiz game I'm making). For some reason I can't get the text. i've tried using text() and the console prints "score: " (nothing there). To test to see if my JS was correct, I tested getting the html from my H1 tag, and it worked! Can someone please see what I'm doing wrong?? Thanks
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<h1>this is a test</h1>
<em>
Your score is
<span class=“score”>0</span>
/
<span>5</span>
</em>
<script>
$(document).ready(function(){
var score1 = $('.score').html();
var h1_text = $('h1').html();
console.log("score: "+ score1);
console.log(h1_text);
});
</script>
</body>
</html>
Jason Anello
Courses Plus Student 94,610 PointsHi Brandon,
I see you figured it out. Those quotes usually come from a word processing application. Are you using one by chance to write your code?
Brandon Jepson
7,018 PointsHi Jason, it was from a pdf doc. Not using it to write the code, but borrowed a couple of lines from the doc. Thanks
Jason Anello
Courses Plus Student 94,610 PointsThanks, good to know. Usually when curly quotes come up it's from a word processor. Whenever pasting from a source other than plain text you'll have to watch out for the curly quotes.
3 Answers
Brandon Jepson
7,018 PointsOk I figured it out. Here's the problem: “score"
See the difference between the first quotation mark and the last? I don't know how you get the 1st one, but that was the problem. Thanks
Chris Hubbard
2,253 PointsBrandon,
Is the score span present at page load (i.e. not dynamically loaded into the page)? If not, you'll need to use a delegated event handler.
Second, if you want the contents of the score span (the 0), you'll want to use the .text() method, not .html()
Brandon Jepson
7,018 PointsThanks Chris. The span is not dynamically loaded on the page. You can see it right there above: <span class=“score”>0</span>. I switched it to text() and it's still not working.
Chris Hubbard
2,253 PointsBrandon,
Your <span> tag is nested inside of an <em> tag. Remove the <em>, and your code should work just fine.
If you need to style your <span> text, use CSS.
Brandon Jepson
7,018 PointsHi Chris, the problem was the quotation marks around "score". I copied the code from a PDF and the formattting was apparently unreadable. Thanks for your help anyways. PS: the nested span tag works fine because it's targeted by the class "score". Thanks
Brandon Jepson
7,018 PointsBrandon Jepson
7,018 PointsUPDATE: I changed it to get just the span tag, not the class 'score' and it worked. So there must be something wrong with the $('.score') part. I'll keep checking.