JSFiddle - React, Tailwind, and code Playground

by mblase75

HTML

<script src="http://code.jquery.com/color/jquery.color-2.1.1.min.js"></script>
<div>click me to change background transparency</div>

CSS

div {
    background-color: red;
    width: 200px;
    height: 80px;
    font-size: 20px;
    padding: 60px 0;
    text-align: center;
    margin: 30px auto;
}

JavaScript

$('div').on('click',function() {
    var clr = $.Color(this,'background-color').alpha();
    // get the current alpha
    var clr2 = $.Color(this,'background-color').alpha(clr/2);
    // reduce the alpha by 50%
    $(this).css('background-color', clr2.toRgbaString());
});