> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kameleoon.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Add and edit JavaScript in the experiment variation

> Inject and update JavaScript code in an experiment variation using the Automation API Partial Update Variation endpoint.

## Requirements

* `access token`

The Automation API requires an [access token](/developer-docs/apis/automation-api-rest/get-started/get-started).
Retrieve the token programmatically by following the instructions in the [obtaining an access token section](/developer-docs/apis/automation-api-rest/get-started/get-started#1-obtain-an-access-token).

### Goal

Update the variation (`Variation 1`) of the [created experiment](./create-a-new-experiment) with:

```javascript theme={null}
Kameleoon.API.Core.runWhenElementPresent("#bloc-567, .cta-button, #bloc-789", function(elements) {
  document.querySelector(".cta-button, #bloc-789").innerText = "More new text";
});
```

Then change the text to **"Updated Text"**.
See the [API reference](/developer-docs/apis/activation-api-js/api-reference/api-reference#runwhenelementpresent) for code details.
The update uses the [Partial Update Variation endpoint](/api-reference/variation/partially-update-a-variation).

* `variationId` and `experimentId`

Find the IDs by selecting `Experiment_1` in the dashboard:

<Frame>
  ![Variation1](https://storage.googleapis.com/kameleoon-storage-documentation/developers/images/api-tutorial/variation-1.jpg)
</Frame>

## Steps

### 1. Inject the JavaScript code

**Endpoint:**

```
PATCH https://api.kameleoon.com/variations/{variationId}
```

| Name         | Type   | Description                                 |
| ------------ | ------ | ------------------------------------------- |
| jsCode       | String | JavaScript code to update.                  |
| name         | String | Variation name.                             |
| experimentId | String | The experiment ID associated with the code. |

**Example:**

```bash theme={null}
curl -L -X PATCH 'https://api.kameleoon.com/variations/1053310' \
-H 'Content-Type: application/json' \
-H 'Authorization: Bearer <ACCESS_TOKEN>' \
--data-raw '{
  "experimentId": 283505,
  "jsCode": "Kameleoon.API.Core.runWhenElementPresent(\".cta-button, #bloc-789\", function(elements) { document.querySelector(\".cta-button, #bloc-789\").innerText = \"Text\";});"
}'
```

### 2. Verify the code injection

Check the Code Editor for `Variation 1`:

<Frame>
  ![Variation1\_dashboard](https://storage.googleapis.com/kameleoon-storage-documentation/developers/images/api-tutorial/variation-1-update.jpg)
</Frame>

<Frame>
  ![Variation1\_code](https://storage.googleapis.com/kameleoon-storage-documentation/developers/images/api-tutorial/variation-1-updated-code.jpg)
</Frame>

### 3. Update the code

Change the text to **"Updated Text"**:

```bash theme={null}
curl -L -X PATCH 'https://api.kameleoon.com/variations/1053310' \
-H 'Content-Type: application/json' \
-H 'Authorization: Bearer <ACCESS_TOKEN>' \
--data-raw '{
  "experimentId": 283505,
  "jsCode": "Kameleoon.API.Core.runWhenElementPresent(\"#bloc-567, .cta-button\", function(elements) { document.querySelector(\".cta-button, #bloc-789\").innerText = \"Updated Text\";});"
}'
```

### 4. Verify the update

Refresh the editor to confirm the update:

<Frame>
  ![Variation1\_button](https://storage.googleapis.com/kameleoon-storage-documentation/developers/images/api-tutorial/variation-1-updated-button-text.jpg)
</Frame>
