can't we make it even simpler?

Question

I wanted to make it even simpler by putting class as arguments, since the difference between to function was just class name.
```javascript
const focusHandler = event => {
  event.target.className = 'highlight';
}
const blurHandler = event => {
  event.target.className = '';
}
```
I tried this but below gave me an error.
```javascript
const nameInput = document.getElementById('name');
const messageTextArea = document.getElementById('message');
const focusToggler = (event, class) => {
  event.target.className = class;
}
nameInput.addEventListener('focus', focusToggler(this, highlight));    // not so sure what to put instead of this.
```
Uncaught SyntaxError: Unexpected token )
Not only I get error early, but an also not sure if putting this there would work.
is there a way to do something like this?

tomd · Accepted Answer

This line of code you are actually calling the focusToggler function
```javascript
nameInput.addEventListener('focus', focusToggler(this, highlight));
``
you'll need to write something like this, also notice howhighlight` is now a string.
javascript
nameInput.addEventListener('focus', function(event){
 focusToggler(event, 'highlight');
});

Whats happening here is im assigned an anonymous function and once the input gets focus it'll call that anonymous function which will then call focusToggler and pass in the arguments.

Welcome to the Treehouse Community

Looking to learn something new?

Juneau Lim

Juneau Lim

can't we make it even simpler?

1 Answer

tomd

tomd

Juneau Lim

Juneau Lim

Cornelius Hager

Cornelius Hager