JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="menu">
    <li><img alt="Green Pepper" src="http://i.stack.imgur.com/dmHl0.png">li</li>
    <li><img alt="Green Pepper" src="http://i.stack.imgur.com/dmHl0.png">li</li>
    <li><img alt="Green Pepper" src="http://i.stack.imgur.com/dmHl0.png">li</li>
    <li id="change">
        <img alt="Red Pepper" src="http://i.stack.imgur.com/dmHl0.png" style="display: none;">
        <img alt="Green Pepper" src="http://i.stack.imgur.com/dmHl0.png"> 
        li
    </li>
    <li><img alt="Green Pepper" src="http://i.stack.imgur.com/dmHl0.png">li</li>
</ul>

CSS

.menu li {
    cursor: default;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10pt;
    list-style-type: none; 
    position: relative; 
    text-align:center; 
    margin: 0 0 0 -25px; 
    padding: 8px 0 0 0;
    width: 118px;
    height: 20px;
    display: inline-block;
    background-image: url(http://modmyi.com/attachments/forums/iphone-4-4s-new-skins-themes-launches/465481d1282224308-classified-hd-cydia-released-goldborder.png);
    background-repeat: no-repeat;
    color: #0091c1;
}

.menu img {
    display: inline;
    vertical-align: -25%;
    padding-right: 6px;
}