JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wheel-wrap">
    <img class="wheel" src="http://babygifts4u.co.uk/rol/wheelhalf.png" />
    <img class="marker" src="http://jquery4u.com/images/marker.png" />
</div>

CSS

#apDiv1 {
	position: absolute;
	width: 200px;
	height: 115px;
	z-index: 1;
	
}

.wheel-wrap {
    position: relative;
    width: 550px;
    height: 550px;
    overflow: hidden;
    margin: 0 auto;
    z-index: 1;
	background-image:url(http://babygifts4u.co.uk/rol/wheel.png);
	background-repeat:no-repeat;
	background-size:550px;
}
.marker {
    top: 10px;
    left: 250px;
    z-index: 2;
    position: absolute;
}
.wheel {
    margin-top: 65px;
    margin-left: 65px;
    width: 420px;
    z-index: 1;
}

JavaScript

$(function(){
        window.WHEELOFFORTUNE = {

            cache: {},

            init: function () {
                console.log('controller init...');

                var _this = this;
                this.cache.wheel = $('.wheel');
                this.cache.wheelMarker = $('.marker');
                this.cache.wheelSpinBtn = $('.wheel');

                //mapping is backwards as wheel spins clockwise //1=win
                               this.cache.wheelMapping = [5,24,16,33,1,20,14,31,9,22,18,29,7,28,12,35,3,26,32,15,19,4,21,2,25,17,34,6,27,13,36,11,30,8,23,10].reverse();

                this.cache.wheelSpinBtn.on('click', function (e) {
                    e.preventDefault();
                    if (!$(this).hasClass('disabled')) _this.spin();
                });

                //reset wheel
                this.resetSpin();

                //setup prize events
                this.prizeEvents();
            },

            spin: function () {
                console.log('spinning wheel');

                var _this = this;

                // reset wheel
                this.resetSpin();

                //disable spin button while in progress
                this.cache.wheelSpinBtn.addClass('disabled');

                /*
                    Wheel has 10 sections.
                    Each section is 360/10 = 36deg.
                */
                var deg = 1500 + Math.round(Math.random() * 1500),
                    duration = 20000; //optimal 6 secs

                _this.cache.wheelPos = deg;

                //transition queuing
                //ff bug with easeOutBack
                this.cache.wheel.transition({
                    rotate: '0deg'
                }, 0)
                    .transition({
                    rotate: deg + 'deg'
                }, duration, 'easeOutCubic');

                //move marker
                _this.cache.wheelMarker.transition({
                    rotate: '-40deg'
                }, 0,...