JSFiddle - React, Tailwind, and code Playground

HTML

<img id='upgrey' class='up' src='http://s24.postimg.org/8v77coekx/up_grey.png' width='26px' onclick='upvote()'>
<img id='upgold' class='up' src='http://s24.postimg.org/jtdvh4dsh/up_raised.png' width='26px' style='display:none' onclick='upvote()'>
<img id='flaggrey' class='flag' src='http://s1.postimg.org/egcymr8cb/flag_grey.png' height='26px' onclick='flag()'>
<img id='flagred' class='flag' src='http://s1.postimg.org/a5yar6397/flag_raised.png' height='26px' style='display:none'  onclick='flag()'

CSS

body {
    background-color: gray;
}

JavaScript

function upvote() {
    if (document.getElementById('upgrey').style.display === 'none') {
 
        document.getElementById("upgrey").setAttribute("style", "display:block");
        document.getElementById("upgold").setAttribute("style", "display:none");
    } else {
      
        document.getElementById("upgold").setAttribute("style", "display:block");
        document.getElementById("upgrey").setAttribute("style", "display:none");
    }

}

function flag() {
     if (document.getElementById('flaggrey').style.display === 'none') {
 
        document.getElementById("flaggrey").setAttribute("style", "display:block");
        document.getElementById("flagred").setAttribute("style", "display:none");
    } else {
      
        document.getElementById("flagred").setAttribute("style", "display:block");
        document.getElementById("flaggrey").setAttribute("style", "display:none");
    }
}