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![](https://ecs-static.teamtreehouse.com/assets/views/marketing/shared/community-banner-white-47072046c51352fe6a69f5e691ff5700b28bb11d45197d7bdf066d9ea3f72d0c.webp)
![Matt Van Dyck](https://secure.gravatar.com/avatar/0418e9d8c7b165430d61a0794d5b115a?s=96&d=https%3A%2F%2Fecs-static.teamtreehouse.com%2Fassets%2Fcontent%2Fdefault_avatar-445fbbabfc8dc9188fb5967fe43322ee0c3e0dd1e10f378bf8343784af5a13eb.webp&r=pg)
Matt Van Dyck
2,033 PointsSimple JQuery Question
Hi there. I am new to JQuery and would like to include a message customized to the time of day on my website and output something based on what time it is. I want this to be in the header of my site as well and I am not sure what I am doing wrong because with this code:
function welcomeMessage()
{
var now = new Date();
var hours = now.getHours();
var msg;
if(hours<12)
msg = "<h3><span>Good Morning</h3></span>";
else if(hours<18)
msg = "<h3><span>Good Afternoon</h3></span>";
else
msg = "<h3><span>Good Evening</h3></span>";
return(msg);
}
That outputs nothing into my header... I am not sure where I am going wrong?
Thank you for your time!
1 Answer
![Abhay Sharma](https://secure.gravatar.com/avatar/09940fad430699b1c0e07cd3fc28e1fe?s=96&d=https%3A%2F%2Fecs-static.teamtreehouse.com%2Fassets%2Fcontent%2Fdefault_avatar-445fbbabfc8dc9188fb5967fe43322ee0c3e0dd1e10f378bf8343784af5a13eb.webp&r=pg)
Abhay Sharma
8,287 PointsJust a few changes
<div class="message"></div>
function welcomeMessage()
{
var now = new Date();
var hours = now.getHours();
var msg;
if(hours<12)
msg = "<h3><span>Good Morning</h3></span>";
else if(hours<18)
msg = "<h3><span>Good Afternoon</h3></span>";
else
msg = "<h3><span>Good Evening</h3></span>";
$('.message').html(msg); //add message to the element with class message
}
welcomeMessage();
![Andrei-Robert Rusu](https://secure.gravatar.com/avatar/56453af3cc03c415ab18a6419f6b4d54?s=60&d=https%3A%2F%2Fecs-static.teamtreehouse.com%2Fassets%2Fcontent%2Fdefault_avatar-445fbbabfc8dc9188fb5967fe43322ee0c3e0dd1e10f378bf8343784af5a13eb.webp&r=pg)
Andrei-Robert Rusu
763 PointsAvoid using classes when it's just one place. You should use IDs for javascript mostly. way faster.
![James Barnett](https://secure.gravatar.com/avatar/43ea08b4fc547e8a5da87c207bea2123?s=60&d=https%3A%2F%2Fecs-static.teamtreehouse.com%2Fassets%2Fcontent%2Fdefault_avatar-445fbbabfc8dc9188fb5967fe43322ee0c3e0dd1e10f378bf8343784af5a13eb.webp&r=pg)
James Barnett
39,199 PointsRepeat after me ... use classes for CSS and ids for JavaScript.
It's still much better to select by ID...because jQuery uses the browser's native method (getElementByID) to do this and doesn't have to do any of it's own DOM traversal, which is much faster.
quote source: http://stackoverflow.com/a/2559973/1756132
Matt Van Dyck
2,033 PointsMatt Van Dyck
2,033 PointsNevermind, I got it to work :D