JSFiddle - React, Tailwind, and code Playground

by chintsu

HTML

<script src="http://www.zurb.com/playground/javascripts/plugins/jquery.textchange.js"></script>
<label for="first"></label><input id="first" type="text" value="" />
<input id="setValue" type="button" value="Set Value" />
<label for="second"></label><input id="second" type="text" value="" />
<div id="log"></div>

CSS

body { font-size: 16px }
p { font-size: 75%; font-family: monospace }
#log { background: #333; color: #eee; border: 3px dashed #aaa; padding: .5em }

JavaScript

var $log = $('#log'),
    $first = $('#first'),
    $setValue = $('#setValue');

$setValue.click(function(){
    $first.val('agu');
});

$first.bind('textchange', function(event, lastValue) {
    $log.append('<p>' + lastValue + ' => ' + $first.val()  + '</p>');
});