JSFiddle - React, Tailwind, and code Playground

HTML

<div id="navitem-1"><a href="#">Slide 1</a></div>
<div id="navitem-2" class="activeSlide"><a href="#">Slide 2</a></div>
<div id="navitem-3"><a href="#">Slide 3</a></div>
<div id="navarro"></div>

CSS

#navitem-1,#navitem-2,#navitem-3{display:block:width:134px;float:left;padding:10px;width:135px;}   
.activeSlide a{color:red;}
#navarro{width:10px;height:10px;background-color:green;position:absolute; margin:50px;}

JavaScript

//Add/Remove Class based on click - in my project this is done automatically (using malsup's Cycle)
    $("#navitem-1 a").click(function(i) {
        $("div").removeClass('activeSlide');
        $("#navitem-1").addClass('activeSlide');
    });
    $("#navitem-2 a").click(function(i) {
        $("div").removeClass('activeSlide');
        $("#navitem-2").addClass('activeSlide');
    });
    $("#navitem-3 a").click(function(i) {
        $("div").removeClass('activeSlide');
        $("#navitem-3").addClass('activeSlide');
    });

    //Conditional Animate Functions
    if ($('#navitem-1').hasClass("activeSlide")) {
        $("#navarro").animate({
            marginLeft: "0px"
        }, 500);
    };
    if ($('#navitem-2').hasClass("activeSlide")) {
        $("#navarro").animate({
            marginLeft: "190px"
        }, 500);
    };
    if ($('#navitem-3').hasClass("activeSlide")) {
        $("#navarro").animate({
            marginLeft: "340px"
        }, 500);
    };