Remove or Add Class on Button Click in LWC

 

removeOrAddClass.html

<template>

<div class="slds-hide slds-text-heading_small">Hello!!!!</div>

<lightning-button label="Show Div" onclick={handleClass}> </lightning-button>

</template>

removeOrAddClass.js

import { LightningElement } from 'lwc';

export default class RemoveOrAddClass extends LightningElement {

handleClass(){

const elmnt = this.template.querySelector('.slds-text-heading_small')

if(elmnt){

elmnt.classList.remove('slds-hide')

elmnt.classList.add('slds-text-color_error')

}

}

}