JSFiddle - React, Tailwind, and code Playground

by travega

HTML

<button id="myButton">Click Me!</button>

JavaScript

// create document
    APP.pageHelper = new APP.PageHelper();
    
    // need to call init manually with jQuery
    APP.pageHelper.initialize();

// namespace our code
window.APP = {};
 
// my class (no Class.create in JQuery so code in native JS)
APP.PageHelper = function() {};
 
// add functions to the prototype
APP.PageHelper.prototype = {
 
  // automatically called
  initialize: function(name, sound) {
    this.myValue = "Foo";
 
    // attach event handlers, binding to 'this' object
    $("#myButton").click($.proxy(this.displayMessage, this));
 
  },
 
 
  displayMessage: function() {
    alert("My value: " + this.myValue); // 'this' is the object not the clicked button!
  }
 
};