Issue: I would like to change the color of the first link to black and the remaining two links to gray when the continue button is clicked once. Then, on the second click of the continue button, I want the color of the second link to be changed to black while keeping the other links gray. This same sequence should repeat for the third click, with an additional change of the continue button text to "Save".
HTML:
<div class="nav2">
<div class="navtxt container">
<ol>
<li id="navlnk">Assess your risk tolerance</li>
<div id="b" class="fif"><a href="#navlnk1" onclick="changeColor('navlnk1'); return false;"><span class="glyphicon glyphicon-menu-right" style="padding-left: 20px;"></span></a></div>
<li id="navlnk1">View your plan</li>
<div id="b" class="fif"><a href="#navlnk2" onclick="changeColor('navlnk2'); return false;"><span class="glyphicon glyphicon-menu-right" style="padding-left: 20px;"></span></a></div>
<li id="navlnk2">Open account</li>
</ol>
</div>
</div>
<input type='button' name='add' onclick="myFunction()"/>
JAVASCRIPT
function myFunction() {
document.getElementById("continue").value++; value='+'
if (value==1){
document.getElementById('navlnk').style.color = "#000";
}
else if(value==2){
document.getElementById('navlnk1').style.color = "#000";
}
else if(value==3)
{
document.getElementById('navlnk2').style.color = "#000";
document.getElementById('navlnk2').inner.html = "Save";
}
}