JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<ul>
   <li class="vbox" id="visbox"><span class="glyphicon glyph2 glyphicon-eye-open" ></span> Vision</li>
   <li class="vbox" id="valbox"><span class="glyphicon glyph2 glyphicon-ok"></span> v2</li>
   <li class="vbox" id="foobox"><span class="glyphicon glyph2 glyphicon-ok"></span> v3</li>
   <li class="vbox" id="dribox"><span class="glyphicon glyph2 glyphicon-ok"></span> v4</li>
   <li class="vbox" id="engbox"><span class="glyphicon glyph2 glyphicon-ok"></span> v5</li>
</ul>

CSS

.vbox{
    list-style: none;
}
.vbox .glyphicon {
    visibility: hidden;
}
.vbox:hover {
    cursor: pointer;
}
.vbox:hover .glyphicon {
    visibility: visible;
}