# Adding id to Input and Select

**URL:** <https://discourse.processing.org/t/adding-id-to-input-and-select/48549>\
**Category:** Beginners\
**Created:** [May 17, 2026, 8:42am UTC](https://discourse.processing.org/t/adding-id-to-input-and-select/48549 "2026-05-17T08:42:43Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![4everJang](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/4everjang/32/21813_2.png) [@4everJang](https://discourse.processing.org/u/4everJang)\
**Post date:** [May 17, 2026, 8:42am UTC](https://discourse.processing.org/t/adding-id-to-input-and-select/48549/1 "2026-05-17T08:42:43Z")

</div>

Trying to programmatically change inputs (and selected options) but there is no @id on any of the input and select fields created with createInput and createSelect. Is this possible at all or do I have to create my own input controls instead ?

---

<div class="post-metadata">

**Author:** ![neill](https://avatars.discourse-cdn.com/v4/letter/n/edb3f5/32.png) [@neill](https://discourse.processing.org/u/neill)\
**Post date:** [May 17, 2026, 10:28am UTC](https://discourse.processing.org/t/adding-id-to-input-and-select/48549/2 "2026-05-17T10:28:28Z")

</div>

Hi! You can set an id by calling [`.id(val)`](https://p5js.org/reference/p5.Element/id/) on the p5.Element you create with createInput or createSelect (etc):

```js
  let myInput = createInput();
  myInput.id("myId");  

```

Here’s a full example of that:

> **[giving-elements-ids-demo-for-4everJang by neill0 -p5.js Web Editor](https://editor.p5js.org/neill0/sketches/pD6Bt0kjN)**
>
> A web editor for p5.js, a JavaScript library with the goal of making coding accessible to artists, designers, educators, and beginners.

### Documentation

- [id](https://p5js.org/reference/p5.Element/id/)
- [p5.Element](https://p5js.org/reference/p5/p5.Element/#:~:text=Sets%20the%20element%27s-,ID,-using%20a%20given)

### Possible alternative

However, a lot of the time people will just keep the reference around from creation and use that directly. I expect you’re familiar with this, but here’s a demo just in case:

> **[instead-of-element-ids-demo-for-4everJang by neill0 -p5.js Web Editor](https://editor.p5js.org/neill0/sketches/k8JxSFYXR)**
>
> A web editor for p5.js, a JavaScript library with the goal of making coding accessible to artists, designers, educators, and beginners.

---

<div class="post-metadata">

**Author:** ![4everJang](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/4everjang/32/21813_2.png) [@4everJang](https://discourse.processing.org/u/4everJang)\
**Post date:** [May 17, 2026, 10:51am UTC](https://discourse.processing.org/t/adding-id-to-input-and-select/48549/3 "2026-05-17T10:51:29Z")

</div>

Thanks for the quick reply.

---

<div class="post-metadata">

**Author:** ![AlviaHong](https://avatars.discourse-cdn.com/v4/letter/a/ee59a6/32.png) [@AlviaHong](https://discourse.processing.org/u/AlviaHong)\
**Post date:** [June 30, 2026, 10:07am UTC](https://discourse.processing.org/t/adding-id-to-input-and-select/48549/4 "2026-06-30T10:07:08Z")

</div>

Nice tip! Another option, if you only need to identify the element later, is to keep a reference to the created input/select when you make it instead of relying on an ID. That can make the code a bit cleaner, especially if you’re creating several UI elements dynamically.