JSFiddle - React, Tailwind, and code Playground

by mrnobody

HTML

<span id="btn" onclick="addbasket();">Положить в авоську</span>

CSS

#btn {
    background:url('http://www.defitsita.net/bitrix/templates/second_page/images/sub.png') 0 0 repeat-x #ff4200;
    border:none;
    -webkit-box-shadow:1px 2px 5px -2px rgba(0, 0, 0, .4);
    -moz-box-shadow:1px 2px 5px -2px rgba(0, 0, 0, .4);
    box-shadow:1px 2px 5px -2px rgba(0, 0, 0, .4);
    color:#fff;
    cursor:pointer;
    display:block;
    float:left;
    font-size:22px;
    font-weight:700;
    height:50px;
    line-height:52px;
    margin:0 auto 10px;
    text-align:center;
    text-shadow:0 0 4px rgba(0, 0, 0, .4);
    text-transform:uppercase;
    width:292px;
}

JavaScript

function addbasket() {
var btn = document.getElementById('btn');
btn.innerHTML = 'Пройти на кассу';
btn.setAttribute('onclick', "window.location.href='/basket.php'");
btn.style.background = 'url(http://www.defitsita.net/bitrix/templates/second_page/images/sm_act_sub.png) 0 0 repeat-x #ed822c';
}