JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://jqueryrotate.googlecode.com/files/jQueryRotateCompressed.2.1.js"></script>

<script src="//code.jquery.com/jquery-1.10.2.js"></script>

CSS

<body>
<p>Has an attached custom event.</p>
<button>Trigger custom event</button>
<span style="display: none;"></span>
<style>
p {
color: red;
}
span {
color: blue;
}
</style>

JavaScript

<script>
$( "p" ).bind( "myCustomEvent", function( e, myName, myValue ) {
$( this ).text( myName + ", hi there!" );
$( "span" )
.stop()
.css( "opacity", 1 )
.text( "myName = " + myName )
.fadeIn( 30 )
.fadeOut( 1000 );
});
$( "button" ).click(function() {
$( "p" ).trigger( "myCustomEvent", [ "John" ] );
});
</script>