Changing CSS content property dynamically

Question

A friend of mine is renting a webshop from a company. He is able to choose from different templates, and has the ability to override the predefined CSS and add javascript sn

Answer 1

Try this:

HTML:

...
example

CSS:

#add_to_cart:before {
    display: block;
    font-size: 35px;
    content: attr(data-content);
    padding-right: 5px;
    font-weight: 400;
    width: 71px;
    height: 71px;
    line-height: 65px;
    text-align: center;
    text-indent: 0;
    text-shadow: none;
    color: red;
}

JS:

$('#add_to_cart').attr('data-content', (document.documentElement.lang == 'en' ? "x" : "y"));

You'll see that the character before 'example' changes when lang attr of is changed.