jQuery addClass example

Change class name on click in jQuery

HTML

<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.createjs.com/easeljs-0.8.2.min.js"></script>
<canvas id="wires" style="position: absolute; z-index: -1; width: 100%; height: 100%;"></canvas><a href="data:;base64,AwIjBwAAAQACAAgADgAAAAAAAAARAAIAAQAAAAsABgABAAAAR0xTTC5zdGQuNDUwAAAAAA4AAwAAAAAAAQAAAA8ABgAEAAAABAAAAG1haW4AAAAACQAAABAAAwAEAAAABwAAAAMAAwACAAAAkAEAAAQACQBHTF9BUkJfc2VwYXJhdGVfc2hhZGVyX29iamVjdHMAAAQACQBHTF9BUkJfc2hhZGluZ19sYW5ndWFnZV80MjBwYWNrAAUABAAEAAAAbWFpbgAAAAAFAAYACQAAAG91dEZyYWdDb2xvcgAAAABHAAQACQAAAB4AAAAAAAAAEwACAAIAAAAhAAMAAwAAAAIAAAAWAAMABgAAACAAAAAXAAQABwAAAAYAAAAEAAAAIAAEAAgAAAADAAAABwAAADsABAAIAAAACQAAAAMAAAArAAQABgAAAAoAAAAAAAAAKwAEAAYAAAALAAAA/KlxPSsABAAGAAAADAAAAAAAgD8sAAcABwAAAA0AAAAKAAAACgAAAAsAAAAMAAAANgAFAAIAAAAEAAAAAAAAAAMAAAD4AAIABQAAAD4AAwAJAAAADQAAAP0AAQA4AAEA"
  download="simple.spv">Simple file</a>, <a...

JavaScript

/**
 * @file HTML5 SPIR-V Editor Globals
 * @author Mike Mestnik
 * @version 0.1
 */

/**
 * jQuery object
 * @external jQuery
 * @see {@link http://api.jquery.com/jQuery/}
 */

/**
 * Restult by ID.
 * @type {Array.<Result>}
 */
var results = [];

/**
 * Running tally of how many bytes the output would be.
 * @type {Number}
 */
var byteLength = 0 | 0;

/**
 * Passed to DataView functions.
 * @type {boolean}
 */
var endian = false

/**
 * Current scope..
 * @type {external:jQuery}
 */
var cur;
var stage;
$(function jQuery_load() {
  cur = $('#white_board');
  stage = new createjs.Stage("wires");
});

var color = createjs.Graphics.getRGB(0x804040, 1);

/**
 * @file HTML5 SPIR-V Editor Utility
 * @author Mike Mestnik
 * @version 0.1
 */

/**
 * Utility functions
 * @type {Object}
 */
var util = {
  _encoder: new TextEncoder(),
  _decoder: new TextDecoder('utf8'),
  /**
   * DataView to string via utf8.
   *
   * @param {DataView} b - The full opperation, for conveyance.
   * @param {Number} o - Word index of first 4 bytes of string.
   * @returns {String} Without traling null byte(s).
   */
  decode: function(b, o) {
    o = o | 0;
    var x = (o << 2) | 0;
    var l;
    for (l = x | 0; l < b.byteLength && b.getUint8(l) != 0; l++);
    return util._decoder.decode(new DataView(
      b.buffer, b.byteOffset + x, l - x));
  },
  /**
   * Resolve an internal row number.
   *
   * @param {Number} l - Pixels left from jQuery.offset().left.
   * @returns {Number} Row ID.
   */
  rowFromLeft: function rowFromLeft(l) {
    l = l | 0;
    return l >> 9;
  },
  /**
   * Resolve from an internal row number.
   *
   * @param {Number} r - Row ID.
   * @returns {Number} jQuery.css({ left: value }).
   */
  leftFromRow: function leftFromRow(r) {
    r = r | 0;
    return r << 9;
  },
  /**
   * Resolve an internal column number.
   *
   * @param {Number} t - Pixels "top" from jQuery.offset().top.
   * @returns {Number} Column ID.
   */
  colFromTopt: function colFromTop(t) {
   ...