# Run a javascript function from p5.js or read a variable in the DOM

**URL:** <https://discourse.processing.org/t/run-a-javascript-function-from-p5-js-or-read-a-variable-in-the-dom/20090>\
**Category:** Coding Questions\
**Created:** [April 24, 2020, 10:45am UTC](https://discourse.processing.org/t/run-a-javascript-function-from-p5-js-or-read-a-variable-in-the-dom/20090 "2020-04-24T10:45:18Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![paolon](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/paolon/32/8956_2.png) [@paolon](https://discourse.processing.org/u/paolon)\
**Post date:** [April 24, 2020, 10:45am UTC](https://discourse.processing.org/t/run-a-javascript-function-from-p5-js-or-read-a-variable-in-the-dom/20090/1 "2020-04-24T10:45:18Z")

</div>

Hi everyone, it’s a pleasure to join this community! I have a problem that I think is quite simple for you but I have been banging my head for days for which I ask for your help.  
I want to make a kind of universal watch so I need to know the difference between local time and Greenwich UTC. In P5 I have not found a specific function, as it exists in javascript and it is `getTimezoneOffset ()`.

The questions I have not found answers are:

- Can I launch a javascript function inside P5.js?
- Or can I read the value of a variable set via javascript in the HTML that hosts my canvans P5.js?

Trying to solve the problem I tried to write the value of the UTC difference in the DOM of the page in this way.

```auto
<body onload="jsFunctions()">
<div id="offsetDiv">test</div>
<script>
function jsFunctions() {
  var d = new Date();
  var n = d.getTimezoneOffset();

 document.getElementById("offsetDiv").innerHTML = n;
}
</script>
</body>

```

Inside p5.js I tried to read the div value using the select function in various ways.

`let offset = document.getElementById('offsetDiv').value;`  
or  
`let offset = select('#offsetDiv');`

But an **undefined value** has always returned to me.  
Can you help me out of it? Thanks!

---

<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:** [April 24, 2020, 1:26pm UTC](https://discourse.processing.org/t/run-a-javascript-function-from-p5-js-or-read-a-variable-in-the-dom/20090/2 "2020-04-24T13:26:46Z")

</div>

- [p5js.org/reference/#/p5/select](http://p5js.org/reference/#/p5/select)
- [p5js.org/reference/#/p5.Element/html](http://p5js.org/reference/#/p5.Element/html)

`const tmz = +select('#offsetDiv').html();`

or…

> **[Element.innerHTML](https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML)**
>
> The Element property innerHTML gets or sets the HTML or XML markup contained within the element.

`const tmz = offsetDiv.innerHTML;`

---

<div class="post-metadata">

**Author:** ![Yom](https://avatars.discourse-cdn.com/v4/letter/y/c4cdca/32.png) [@Yom](https://discourse.processing.org/u/Yom)\
**Post date:** [April 24, 2020, 1:31pm UTC](https://discourse.processing.org/t/run-a-javascript-function-from-p5-js-or-read-a-variable-in-the-dom/20090/3 "2020-04-24T13:31:41Z")

</div>

Unless I didn’t understand your problem, you can put your function directly in sketch.js, which is a javascript 🙂

```javascript
function setup() {
  createCanvas(400, 400);
  fill("white");
  var d = new Date();
  var n = d.getTimezoneOffset();
  text(d, 10, 10);
  text(n, 10, 30);
}

```

---

<div class="post-metadata">

**Author:** ![paolon](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/paolon/32/8956_2.png) [@paolon](https://discourse.processing.org/u/paolon)\
**Post date:** [April 24, 2020, 1:55pm UTC](https://discourse.processing.org/t/run-a-javascript-function-from-p5-js-or-read-a-variable-in-the-dom/20090/4 "2020-04-24T13:55:07Z")

</div>

Thanks a lot Yom, I knew it was a somewhat stupid question. Injecting JS code into my J5.js had been my first test but it hadn’t worked … I think for errors somewhere else. Anyway as you tell me it works, thanks for the time!