change CSS within for loop

Question

I have the following:

function validateInput(departmentArray) {
  let isValid = true
  const array = Object.keys(departmentArray)

  for(let i=0; i < array.length; i++) {
    keyname = array[i]
    if (departmentArray[keyname] === '') {
        const errorMsg = `Missing \'${keyname}\' on form`
        isValid = false

        $('#`keyname`').toggleClass('warningBox')

    }
  }
  return isValid
}

The keyname that errors out due to being empty needs to be given a red box around in the HTML. I have tried

$('#`keyname`').toggleClass('warningBox')

and variations thereof. How do I address the keyname with JQuery to be able to change its CSS ?

Are you trying to add the string `keyname`, or add the value of `keyname`? Please clarify your intent. — Jimenemex, Jun 26 '18 at 20:04
semicolons are optional. I tried concatenating them and it didn't work for me. I want the value of keyname — HJW, Jun 27 '18 at 00:08
While optional, they serve a purpose and not using them can lead to bugs if not used. https://stackoverflow.com/questions/444080/do-you-recommend-using-semicolons-after-every-statement-in-javascript#444082 And given that you should always be using a minifier for productional javascript, not using semicolons would cause bugs, since minifiers make everything a single line. — Taplar, Jun 27 '18 at 13:56
@Taplar thank you for the link and explanation. Just learned something new — HJW, Jun 27 '18 at 18:38

score 0 · Accepted Answer · answered Jun 26 '18 at 20:08

0

If you are trying to use a template literal, then your syntax is incorrect.

$(`#${keyname}`).toggleClass('warningBox');

var keyname = 'me'
var test = `#${keyname}`;
console.log(test);

answered Jun 26 '18 at 20:08

Taplar

24,788
4
22
35

This did it. Had the template literal incorrect. Thanks – HJW Jun 27 '18 at 01:52

change CSS within for loop

1 Answers1