JSFiddle - React, Tailwind, and code Playground

HTML

<div id="foo">Click Me</div>
<div id="report">Report:</div>

CSS

#foo {background:red; width: 200px; height:50px; font:400 16px/50px tahoma; color:white; text-align:center;}
#report {
position: absolute;
width: 350px;
right: 0;
top: 0;
}
#report > div {margin:1em;padding:1em; background:#eee;}

JavaScript

window.onload = function() {
document.getElementById("foo").addEventListener("click",clickedBtn,false);
}
function clickedBtn(event) {
    var x = document.createElement("div");x.textContent = "Clicked";document.getElementById("report").appendChild(x);
    var prefix = getTransitionPrefix(),el=event.target;
    if(prefix !== false){el.style[prefix+"Transition"] = "all 1s ease-out 0s";}
    el.style.marginTop = "200px";
    el.style.marginLeft = "100px";
    el.addEventListener("webkitTransitionEnd",transitionEnd,false);
    el.addEventListener("transitionend",transitionEnd,false);
    el.addEventListener("oTransitionEnd",transitionEnd,false);
    el.addEventListener("msTransitionEnd",transitionEnd,false);
}

function transitionEnd(event) {
    var eventContainer = document.createElement("div"),w = document.createElement("div"),x = document.createElement("div"),y = document.createElement("div"),z = document.createElement("div");
    eventContainer.className = "eventContainer";
    eventContainer.textContent = "Event:";
    document.getElementById("report").appendChild(eventContainer);
    w.textContent = event.propertyName + " == " + event.target.style[event.propertyName];
    document.getElementById("report").lastChild.appendChild(w);
    x.textContent = event.propertyName + " in event.target.style == " + (event.propertyName in event.target.style).toString();
    if(!(event.propertyName in event.target.style) && (event.target.style.cssText.indexOf(event.propertyName) !== -1)){x.textContent += ", but this should be true and == " + event.target.style[event.propertyName.replace(/-([a-z])/gi, function(s, group1) {return group1.toUpperCase();})] + " and I shouldn't have to convert to camelCase to get it either!";}
    document.getElementById("report").lastChild.appendChild(x);
    y.textContent = event.propertyName + " in event.target.style.cssText == " + (event.target.style.cssText.indexOf(event.propertyName) !== -1).toString();
   ...