I have the HTML:

```html
<div class="dropdown">
  <button class="dropbtn">Game Design</button>
  <div class="dropdown-content">
    <a id="GameIdea" href="GameIdea.html">Link 1</a>
    <a id="GameMechanics" href="GameMechanics.html">Link 2</a>
    <a id="GameCharacters" href="GameCharacters.html">Link 3</a>
    <a id="Inspiration" href="Inspiration.html">Link 3</a>
  </div>
</div>

```

And the JavaScript:

```
var anchor = document.getElementById(pathShort); //e.g. pathShort == GameIdea
var anchorParent = anchor.parentNode;
var button = anchorParent.previousSibling;
button.classList.add("active");

```

The issue is this - I don't want the anchor element:`document.getElementById(pathShort);`

I want the button element, therefore as you can see I use `anchor.parentNode;` to get the `div` that the anchor is in, and then `anchorParent.previousSibling;` to get the element beside the `div`, before not after.

In my mind I thought this would work but in console I get the error `Cannot read property 'add' of undefined`, therefore the variable `button` must be effectively `null` or `empty`, meaning my method of DOM traversal prior to the 'add' call has not worked.