JSFiddle - React, Tailwind, and code Playground

by Qwerty_Wasd

HTML

<div class="list">
        <input type="text" class="js-input">
        <button class="js-btn-add">add</button>
        <div class="js-list-view"></div>
    </div>

html:
<div class="list">
        <input type="text" class="js-input">
        <button class="js-btn-add">add</button>
        <div class="js-list-view"></div>
    </div>

JavaScript

(function() {

    "use strict"

    let List = {
        init: function() {
            this.casheDom();
            this.bindEvent();
        },
        casheDom: function() {
            this.input = document.querySelector(".js-input");
            this.button = document.querySelector(".js-btn-add");
        },
        bindEvent: function() {
            this.button.addEventListener("click", this.addItem.bind(this));
        },
        addItem: function() {
            console.log("click test");
        }
    };

    List.init();
})();