jQuery not working on code pen?

1

I’ve added the library and made a function to change the body background to black when the web page has loaded but have gotten nothing. Here’s the code pen:http://codepen.io/david_vu408/pen/MJJrBv. Can anyone see the mistake?

1 Like
2

Hey there! You have to put “body” in quotations.

3

By the way, try using your dev console. It’s an excellent tool for debugging. It was showing that “body” wasn’t defined.

4

Have you tried with both jQuery and jQuery UI? I had problems at first with it too, but jQuery UI fixed my problems.

pic1.jpg1363×591 23.1 KB

pic2.jpg1363×595 97.4 KB

pic3.png1363×603 48.1 KB

2 Likes
5

**_

if you have mixed http/https libs, codepen will not allow it to run unless the libs are over https

_**

open your BROWSER dev console when running your code, don’t rely on codepen console to catch a LOT of stuff.

This is CodePen console from YOUR pen:

"jQuery.Deferred exception: body is not defined" "@pen.js:26:5
g/</j@https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js:2:29566
g/</k<@https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js:2:29882
" undefined

This is my MSedge console from your pen"

An iframe which has both allow-scripts and allow-same-origin for its sandbox attribute can remove its sandboxing.  MJJrBv
updateBlockedAdsCount 1  frames.js:329
jQuery.Deferred exception: body is not defined @pen.js:26:5
g/</j@https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js:2:29566
g/</k<@https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js:2:29882
 undefined  console_runner-5710c30fb566082d9fcb6e7d97ee7e3f2a326128c9f334a4231b6fd752b29965.js:1:2206
ReferenceError: body is not defined[Learn More]  index.html:26:5
	<anonymous> pen.js
	g/</j https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js:2:29566
	g/</k< https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js:2:29882
6

So all you need is for the background to transition from blue to black when it loads, right? Because in JS I see you have background color being blue.

By the way, the reason why it’s giving you ReferenceError: body is not defined is because instead of

you should do this

body must be in quotation marks, otherwise your function won’t work.
It’s in one of the jQuery lessons .

2 Likes
7

Ahhhh! Just a quick fix, quotation marks around body. Thank you everyone!

1 Like
8