JSFiddle - React, Tailwind, and code Playground

HTML

<div class="steps">
    <ol>
        <li>Apply an Email To Your Nation</li>
        <li>Apply To the <a href="http://www.nationstates.net/page=un">World Assembly</a> With That Email</li>
    </ol>
</div>

CSS

html, body {
    background: #000;
    color: #e7e7e7;
    font-family:"Helvetica", "Arial", "Bitstream Vera Sans", "Verdana", sans-serif;
    margin:0;
    padding:0;
}
a {
    color: #447643;
    text-decoration:none;
}
.steps {
    width:400px;
    margin:0 auto;
    text-align:left;
    line-height: 200%;
}
.steps a:hover {
    text-decoration: underline;
}
.steps li:hover, .steps li:hover a {
    cursor: pointer;
    color: rgb(66, 81, 95);
}

.steps li a:hover {
    color: #447643;
}

JavaScript

$(".steps li a").hover(function() {
    $(this).parent().attr("style", "color: #e7e7e7");
}, function() {
    $(this).parent().attr("style", "");
});