JSFiddle - React, Tailwind, and code Playground

by Stev Peifer

HTML

Hover your mouse over the abilities and prayers:
<br />
<div id="some-id" style="margin-left:100px;">
    This text will be emptied...
</div>

JavaScript

/*
 * AbilityBar - You've Got The Ability. :P.
 * By Stev Peifer (http://www.tip.it)
*/
(
    function($){
        $.fn.abilityBar=function(option){
            
        //~ Check and throw errors for invalid options
            if(Object.prototype.toString.call(option)!='[object Array]')
                $.error('$().abilityBar() - Unexpected value passed for option: option.\n\t• '+(typeof option).titleCapitalize()+' is not a valid value type.');
            if(this.length!=1||this.prop('tagName')!='DIV')
                $.error('$().abilityBar() - Unexpected value passed for selector:\n\t• $().abilityBar() must be called on a single DIV element.');
        //~ Create needed arrays and object
            var _this=this;
            var abilityArray=[
                
            //~ Attack abilities
                {
                    class:'Basic',
                    cooldown:3,
                    description:'Slice your target for up to 125% weapon damage. In addition, has a 10% greater chance of being a critical hit.',
                    level:1,
                    name:'Slice',
                    type:'Attack'
                },
                {
                    class:'Threshold',
                    cooldown:30,
                    description:'Cause your target to bleed for 100-250% weapon damage over 5 seconds. If the target moves location, they suffer 3x damage.',
                    level:2,
                    name:'Slaughter',
                    type:'Attack'
                },
                {
                    class:'Ultimate',
                    cooldown:30,
                    description:'Overpower your target, dealing up to 200-400% weapon damage.',
                    level:3,
                    name:'Overpower',
                    type:'Attack'
                },
                {
                    class:'Basic',
                    cooldown:10,
                    description:'Instantly attack with both weapons for 100% of...