JSFiddle - React, Tailwind, and code Playground
HTML
<!-- JavaScript element.classList Object length property Example -->
<!-- blog.kevinchisholm.com -->
<div id="foo" class="baz bif bear bully">click me to see my class list and its length property</div>
CSS
#foo:hover{
cursor:pointer;
}
.bar{
background-color: yellow;
padding: 10px;
font: bold 22px Arial;
color: red;
}
JavaScript
var foo = document.getElementById('foo');
foo.addEventListener('click',function(){
this.classList.toggle("bar");
this.innerHTML = 'my classes are: ' + this.classList.toString() + ', and the length of my classList property is: ' + this.classList.length;
},false);