JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/themes/ui-lightness/jquery-ui.css">
<div id="health">Health</div>
<div id="billing">Billing</div>
<div id="pension">Pension</div>

<div id="tournums">
    <ul>
        <li>
            <a class='num_active'>some a element</a>
        </li>
        <li>
            <a>some a element</a>
        </li>
        <li>
            <a>some a element</a>
        </li>
    </ul>
</div>

CSS

div {
    position:absolute;
    margin: 10px;
    padding: 6px;
    border: 2px dashed orange;
}
#tournums {
    position:relative;
    top: 100px;
    border:none;
}
.num_active {
    background: yellow;
}

JavaScript

var arr = [
    $("#pension"),
    $("#health").hide(),
    $("#billing").hide()
];

var $aElements = $("#tournums ul li a");
var cur = 0, nxt = 1;

setInterval(function() {
    arr[cur].fadeOut(2000);
    arr[nxt].fadeIn(2000);
    $aElements.removeClass('num_active');
    $aElements.eq(nxt).addClass("num_active");
    cur = (cur + 1 < arr.length) ? cur + 1 : 0;
    nxt = (nxt + 1 < arr.length) ? nxt + 1 : 0;
},6000);