Div not showing up in javascript?

Question

I'm doing the odin project and for the front-end webdev project, I have to create a grid using javascript/jQuery. I tried using the createElement method but I was wondering how I would be able to make the div visible in html? Am I going about this all wrong?

HTML:

<!DOCTYPE html>
    <html>

    <head>
        <title>Etch-a-Sketch</title>
        <link rel="stylesheet" type="text/css" href="etch-a-sketch.css">

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

        <script type = "text/javascript" src="etch-a-sketch.js"></script>

    </head>

    <body>


    </body>

</html>

JS:

var div = document.createElement("div");
div.style.width = "100px";
div.style.height = "100px";
div.style.color = "blue";

document.body.appendChild(div);

Are you getting some error?...you didn't write anything in the div, try div.innerHTML = 'hi'; — Ejaz
– Ejaz, Commented Mar 15, 2015 at 6:12

balajisoundar · Accepted Answer · 2015-03-15 06:11:32Z

2

Add background-color

var div = document.createElement("div");
div.style.width = "100px";
div.style.height = "100px";
div.style.color = "blue";

div.style.backgroundColor = "yellow";//you forgot background color

document.body.appendChild(div);

answered Mar 15, 2015 at 6:11

balajisoundar

5712 silver badges11 bronze badges

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

1 Comment

glocklesnar Over a year ago

I added background color but am I link tagging the javascript correcting in my html? how would I run this in Sublime Text 2?

Miguel · Accepted Answer · 2015-03-15 06:14:29Z

1

Add more styling to make it visible, such as a border or background color.

var div = document.createElement("div");
div.style.width = "100px";
div.style.height = "100px";
div.style.color = "blue";
div.style.backgroundColor = "blue";

document.body.appendChild(div);

answered Mar 15, 2015 at 6:14

Miguel

20.7k5 gold badges47 silver badges68 bronze badges

Collectives™ on Stack Overflow

Div not showing up in javascript?

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related