Skip to content

Instantly share code, notes, and snippets.

@mhamzas
Created July 8, 2020 14:15
Show Gist options
  • Select an option

  • Save mhamzas/7dbb8633c7ee31102e1fe707651c4129 to your computer and use it in GitHub Desktop.

Select an option

Save mhamzas/7dbb8633c7ee31102e1fe707651c4129 to your computer and use it in GitHub Desktop.
Toggle Class (classList Approach)
/*to show the image*/
.SelectedBorderOrgType .markIcon {
display: block;
}
/*to hide the image*/
.NonSelectedBorderOrgType .markIcon {
display: none;
}
.SelectedBorderOrgType .pillLabel1 {
font-weight: 600;
}
.NonSelectedBorderOrgType{
font-weight : normal;
}
<div class="NonSelectedBorderOrgType" onclick={toggleOrgType}>
<img class="markIcon" src={markIcon} alt='marked'>
<div class="pillLabel1">{type.LKUP_DSC__c}</div>
</div>
toggleOrgType(event){
const evt = event.currentTarget;
evt.classList.toggle('SelectedBorderOrgType');
evt.classList.toggle('NonSelectedBorderOrgType');
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment