# Canvas not appearing in Div

**URL:** <https://discourse.processing.org/t/canvas-not-appearing-in-div/24008>\
**Category:** Beginners\
**Created:** [September 21, 2020, 9:30pm UTC](https://discourse.processing.org/t/canvas-not-appearing-in-div/24008 "2020-09-21T21:30:37Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![minirachel](https://avatars.discourse-cdn.com/v4/letter/m/e56c9b/32.png) [@minirachel](https://discourse.processing.org/u/minirachel)\
**Post date:** [September 21, 2020, 9:30pm UTC](https://discourse.processing.org/t/canvas-not-appearing-in-div/24008/1 "2020-09-21T21:30:37Z")

</div>

Hi, I’m brand new. I’m building a project that relies on a section in the middle of the website generating a random output from a list. This is my p5 code:

```auto
let words = ["stretching", "drink water", "sun"
]

function setup() {
  sketchWidth = document.getElementById("output").offsetWidth;
  sketchHeight = document.getElementById("output").offsetHeight;
 let renderer = createCanvas(sketchWidth, sketchHeight);
  renderer.parent("output");
  textFont("Righteous",36);
  fill('rgb(0,255,0)');
  noLoop();
}

function draw() {
  background(220); 
  let randomwords = random(words);
  text(randomwords, 200, 50);
}

```

the html is just

```auto
<div class="output"></div>

```

with the css currently set at display:block. The p5 works when I test it in the web editor but I’m losing the canvas when I try to pull it all together in brackets. I’ve included a console.log line to make sure it’s all connecting, which it does.

Thanks for any help or links!

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [September 21, 2020, 9:47pm UTC](https://discourse.processing.org/t/canvas-not-appearing-in-div/24008/2 "2020-09-21T21:47:11Z")

</div>

> [@minirachel](#):
>
> `<div class="output"></div>`

A tag needs a unique _id_ attribute in order to be found by p5.Element::**parent()** method:

- [reference | p5.js](http://p5js.org/reference/#/p5.Element/parent)

`<div class="output" id="output"></div>`

---

<div class="post-metadata">

**Author:** ![minirachel](https://avatars.discourse-cdn.com/v4/letter/m/e56c9b/32.png) [@minirachel](https://discourse.processing.org/u/minirachel)\
**Post date:** [September 21, 2020, 10:13pm UTC](https://discourse.processing.org/t/canvas-not-appearing-in-div/24008/3 "2020-09-21T22:13:24Z")

</div>

HA yes. thank you @GoToLoop I wish I posted two hours ago 😌