JSFiddle - React, Tailwind, and code Playground

by rwaldron

HTML

Click the grey box. The expected results should be:<br />
<pre>
x=1
z=2
</pre><br />
Unforuntately, the saved event data of the second click overwrites the first.
<div id="tester">
    
</div>
<textarea id="results"></textarea>

CSS

#tester { width: 100px; height: 100px; background-color: #CCC; }
textarea { width: 100px; height: 200px; }

JavaScript

// function that runs on this element, for example
var handler = function( event ) {
            var $results =  $('#results');
            
            console.log($.param( event.data ))
                
            $results.val( 
                $results.val() + "\r\n" + $.param( event.data ) 
            ); 
        };

$('#tester')
.bind( 'click', { x : 1 }, handler )
.bind( 'click', { z : 2 }, handler );