Question: I am trying to place a button after an already existing button on another website. I'm trying to test it out in Chrome console, but can't figure it out.

```
var buttonPosition = document.getElementById('<button class="button black ">Black</button>');

```

This is the button that I want to place my button behind.

I then tried using the `.insertAdjacementHTML` function to get the button placed behind "button black"

```
buttonPosition.insertAdjacentHTML("afterend", "<button>Hello</button");

```

Then I get the error message 

> 
> "Uncaught TypeError: buttonPosition.insertAdjacentHTML is not a
>  function
>  at :1:16"
> 
> 
> 

This could be a rookie error, as I am very new to coding. Any help at all will be greatly appreciated. Thanks.

Answer: 
That's because the value of your `getElementById()` is not an element's ID name but an element. Try adding an ID on your button then pass its ID name to `getElementById()` as the value, like this:

HTML

```
<button class="button black" id="btn">Your button with an ID</button>

```

Javascript

```
var btn = document.getElementById('btn'); // The button itself with an ID of 'btn'
var newButton = '<button>New button</button>'; // New button to be inserted

btn.insertAdjacentHTML('afterend', newButton);

```
**"document.getElementById"** itself clarify that it want "id" of the element. As per your snippet `var buttonPosition = document.getElementById('<button class="button black ">Black</button>');` I can say that you are missing the "id" but the element itself. 

**Solution 1::**
Provide the id to the button and then try to use that id like:

```
<button class="button black " id="btn">Black</button>

```

Javascript:

```
var buttonPosition = document.getElementById('btn');

```

**Solution 2::**

If you are not able to provide the id, then use the class name.

```
var buttonPosition = document.getElementsByClassName('button')[0];
var newButton = '<button>Button</button>'; 
buttonPosition.insertAdjacentHTML('afterend', newButton);

```