JSFiddle - React, Tailwind, and code Playground
HTML
<div class="menu homecurrent" id="men_shirt">
<ul>
<li class="current" id="stoffcombo549" onClick="showFabrics(549)" ><a id="tab1" onClick="set_menuselected('Fabric');"><b>Fabric</b></a>
<div class="combotext" >Aix-en-Provence</div>
</li>
<!--<ul>
<li><a href="solid.html">Solid</a></li>
<li><a href="stripe.html">Stripe</a></li>
<li><a href="grids.html">Grids</a></li>
<li><a href="non-tron.html">Non-Tron</a></li>
</ul>-->
<li id="style" class=""> <a id="tab2" text="Very comfortabel fit for maximum moving freedom." title="Loose fit" title1="thumb2/image100.jpg" onClick="set_menuselected('Style');displayThumb(this,jQuery(this).attr('title1'), jQuery(this).attr('text'));showOptions(this, 500)"><b>Style</b></a>
<ul>
<li style="z-index:79;" id="opt-500" text="Very comfortabel fit for maximum moving freedom." title="Loose fit" title1="thumb2/image100.jpg" onClick="displayThumb(this,jQuery(this).attr('title1'), jQuery(this).attr('text'));showOptions(this, 500)" > <a onClick="set_sub_menuselected('Fit');">Fit</a>
<div class="combotext" id="opt-500-combotext">Loose fit</div>
</li >
<li class="" style="z-index:78;" id="opt-503" text="Fastening not visible." title="Without placket" title1="thumb2/image119.jpg" onClick="displayThumb(this, jQuery(this).attr('title1'), jQuery(this).attr('text'));showOptions(this, 503)" > <a onClick="set_sub_menuselected('Fastening');">Fastening</a>
<div class="combotext">Without placket</div>
</li>
<li class="" style="z-index:77;" id="opt-502" text="Long sleeve." title="Long sleeve" title1="thumb2/image128.jpg" onClick="displayThumb(this, jQuery(this).attr('title1'), jQuery(this).attr('text'));showOptions(this, 502)" > <a onClick="set_sub_menuselected('Sleeve');">Sleeve</a>
<div class="combotext">Long sleeve</div>
</li>
<li class="" style="z-index:76;" id="opt-515" text="The classical straight collar can be worn...
JavaScript
jQuery.fn.reverse = [].reverse;
$("#next_option").click(function(){
console.log("next");
var toHighlight = jQuery('.current').next().length > 0 ? jQuery('.current').next() : jQuery('#men_shirt li').first();
jQuery('.current').removeClass('current');
toHighlight.addClass('current');
$('#men_shirt ul li').reverse().each(function(i)
{
var iid=$(this).attr('id'); // This is your rel value
console.log("All IDS:"+iid);
});
var a=jQuery('li').hasClass('current');
console.log(a);
if(a=='style')
{
set_menuselected('Style');
}
});