JSFiddle - React, Tailwind, and code Playground

by Luke Pearce

HTML

<input id="text-1"></input><br>
<button id="send">Send</button>

<div id="output">
</div>

<!--
Write a display function that listens out for a “newData” event and outputs the passed in data to the innerHTML of a div with an id of “output”. Trigger this event from a click of a button and the keyup in a textarea
-->

JavaScript

var mediator = $({});

var dataListener = {    
    respond: function(){
        mediator.on('newData', function(e, params){
           $('#output').html(params.name);
        });
    } 
}

var dataInput = {
    send: function(){
        mediator.trigger('newData', {
            name: 'Neo'
        });
    }
}

var App = {
    init: function(){
        dataListener.respond();
    //    dataInput.send();
    }
}

App.init();

$("#text-1").keyup(function() {
    dataInput.send({
       
    });
    
});