JSFiddle - React, Tailwind, and code Playground

by davestein

HTML

<input type="button" id="test" value="Click me" class="good" style="padding: 10px;" /><br />
<br />
<br />
<br />
<input type="button" id="switch-class" value="Switch Class" />

CSS

.good { background-color: #00CC00; }
.bad { background-color: #AA0000; }

JavaScript

$('.good').live( 'click', function() {
   
    console.log( 'good from live' );
    
});


$('body').on( 'click', '.good', function() {
   
    console.log( 'good from on, used like live' );
    
});


$('.bad').live( 'click', function() {
   
    console.log( 'bad from live' );
    
});


$('body').on( 'click', '.bad', function() {
   
    console.log( 'bad from on, used like live' );
    
});

$('#switch-class').on( 'click', function() {
   $('#test').toggleClass('good').toggleClass('bad');
});