JSFiddle - React, Tailwind, and code Playground

by air_hadoken

HTML

<script src="http://canjs.com/release/latest/can.jquery.js"></script>

CSS

.strike {
    text-decoration: line-through;
}

JavaScript

can.Observe.extend("Task")

TaskStriker = can.Control({
  "{task} completed": function(){
       this.update();
  },
  update: function(){
    if ( this.options.task.completed ) {
         this.element.addClass( 'strike' );
       } else {
      this.element.removeClass( 'strike' );
    }
  }
});

var div = $("<div>strike</div>").appendTo(document.body);
var taskstriker = new TaskStriker(div, { 
  task: new Task({ completed: false }) 
});

taskstriker.options.task.attr("completed", true);