add class to html inside backtick base on condition-CodePudding

i want to add class with the name -selected using ternaryoperator to my div with classname poll__option if the variable selectd equal to item.labe

   for (const item of data) {
      const template = document.createElement("template");
      const fragment = template.content;
      template.innerHTML = `
        <div >
      <div ></div>
      <div >
        <span >${item.label}</span>
        <span >${item.percentege}</span>
      </div>
    </div>
    `;
    }

I expect that if selected==item.label it will add class with name -selected to my div

CodePudding user response：

Use a variable and replace it in the template

for (const item of data) {
  const template = document.createElement("template");
  const fragment = template.content;
  const myClass = selected==item.label ? 'poll__option-selected' : 'poll__option';
  template.innerHTML = `
    <div >
      <div ></div>
      <div >
        <span >${item.label}</span>
        <span >${item.percentege}</span>
      </div>
    </div>
  `;
}