The user can choose the word on the left, that choice is added to the widow on the right. More accurately, that word should be added to a global array, then that array is displayed on the right. We want to do it that way, because it allows us to modify the word before it’s displayed.

The modification is that the letters chosen should be replaced by and \* character, when the word is displayed on the window on the right. When the letter changes. The display on the window on the right should reflect that change. You do not want to maminpulate the words in the right window directly, because information is loss when a letter is replaced by a \*, and the original letter cannot be recovered.

Note that for a select tag, you get the input value like you would any other input.

[![enter image description here](https://i.stack.imgur.com/0D72Y.png)](https://i.stack.imgur.com/0D72Y.png)

```js
var addword = document.getElementById('addword').value;
var letter = document.getElementById('letter').value;

var display = document.getElementById('display').innerHTML = addword;
```

```html
<select id="addword">
  <option value="dog">dog</option>
  <option value="cat">cat</option>
  <option value="tiger">tiger</option>
</select>

<select id="letter">
  <option value="a">a</option>
  <option value="b">b</option>
  <option value="c">c</option>
</select>

<div id="display"></div>
```