why this simple snippet of javascript code dosen't work

Question

Where am I doing wrong? Why this snippet of javascript code dosen't work?

This must be easy, but I just don't know why, I'm really a newbie at this

<!DOCTYPE html>
<html>
<body>

<p id="demo">Click the button to make a BUTTON element.</p>

<button onclick="myFunction()">Try it</button>

<script type="text/javascript">

function myFunction()
{
var bodyel = document.getElementById("body");
var block = document.createElement("div");
block.innerHTML = "whatever";
bodyel.appendChild(block);
};


</script>

</body>
</html>

Pointy · Accepted Answer · 2013-08-23 03:31:18Z

2

Your <body> element does not have an "id" attribute at all, let alone one whose value is "body".

You could do this:

<body id=body>

Or this:

var bodyel = document.getElementsByTagName('body')[0];

Or just:

var bodyel = document.body;

edited Aug 23, 2013 at 3:31

answered Aug 23, 2013 at 3:29

Pointy

415k62 gold badges600 silver badges631 bronze badges

Sign up to request clarification or add additional context in comments.

12 Comments

cocco Over a year ago

document.body.. is enough

Evan Trimboli Over a year ago

Not sure why you reverted my edit. The id attribute should have quotes around it.

Pointy Over a year ago

@EvanTrimboli quotes are not required in HTML.

Pointy Over a year ago

@EvanTrimboli why, if they're not required? What's the benefit of adding 2 bytes to the size of the page? Remember, people on mobile devices literally pay for those bytes!

Evan Trimboli Over a year ago

Try adding 2 classes to an element without using quotes. Or any attribute with some kind of special character. Or if you're embedding attributes dynamically via some server-side language. It's a convention that's so widely used that you'd struggle to find many counter-examples.

|

Konsole · Accepted Answer · 2013-08-23 03:30:21Z

0

Here is the problem

var bodyel = document.getElementById("body"); //body is not id

You can use

getElementsByTagName('body')[0];

or

var b = document.body;

answered Aug 23, 2013 at 3:30

Konsole

3,4753 gold badges31 silver badges41 bronze badges

1 Comment

cocco Over a year ago

getElementsByTagName('body')[0]

skub · Accepted Answer · 2013-08-23 03:32:00Z

0

Change the line:

var bodyel = document.getElementById("body");

To the following

var bodyel = document.body;

answered Aug 23, 2013 at 3:32

skub

2,3161 gold badge23 silver badges34 bronze badges

Comments

cocco · Accepted Answer · 2013-08-23 03:35:53Z

0

The body does not need to be called with a id

and if yes you have to add that id.

<!DOCTYPE html>
<html>
<body>
<p id="demo">Click the button to make a BUTTON element.</p>
<button onclick="myFunction()">Try it</button>
<script type="text/javascript">
function myFunction() {
 var bodyel = document.body;
 var block = document.createElement("div");
 block.innerHTML = "whatever";
 bodyel.appendChild(block)
}
</script>
</body>
</html>

edited Aug 23, 2013 at 3:35

answered Aug 23, 2013 at 3:29

cocco

16.8k7 gold badges65 silver badges77 bronze badges

Comments

Community · Accepted Answer · 2017-05-23 12:28:55Z

0

Fiddle

You need to change your code a little:-

var bodyel = document.getElementsByTagName("body")[0];

Rest will work. Have a look at this fiddle. Also try looking into document-body-appendchildi

edited May 23, 2017 at 12:28

CommunityBot

11 silver badge

answered Aug 23, 2013 at 3:40

Shubh

6,7499 gold badges54 silver badges86 bronze badges

Collectives™ on Stack Overflow

why this simple snippet of javascript code dosen't work

5 Answers 5

12 Comments

1 Comment

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

12 Comments

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related