Actually the code itself

jQuery(".lk_meny_active ul li:not("+data+") a").attr("disabled", "disabled").attr("href", "javascript:void(0)").addClass("lk_meny_active_no");

In +data+ I have item IDs - #item-110,#item-111,#item-112

This script takes li with these id's and sets a class for them, but I need to choose the next next id to do it.

I tried it like this but it doesn't work.

 jQuery(".lk_meny_active ul li:not("+data+") a").prev().attr("disabled", "disabled").attr("href", "javascript:void(0)").addClass("lk_meny_active_no"); 

 jQuery(window).load(function() { $(".lk_meny_active ul li:not('#item-110,#item-111,#item-112') a").attr("disabled", "disabled").attr("href", "javascript:void(0)").addClass("lk_meny_active_no"); }); 
 .lk_meny_active ul { display: none; } .lk_meny_active ul li.current.active, .moduletablelk_balans ul li.current.active { background: #2FC7A9 !important; color: #FFF !important; } .lk_meny_active ul li.current.active a span, .moduletablelk_balans ul li.current.active a span { background: none; color: #FFF !important; } .lk_meny_active ul li:Hover, .moduletablelk_balans ul li:Hover { background: #F6F5F6; } .lk_meny_active ul li A, .moduletablelk_balans ul li A { background: none !important; font-size: 16px !important; } .lk_meny_active ul { counter-reset: li; } .lk_meny_active ul li a:before { display: inline-block; content: counter(li); counter-increment: li; padding: 0px; height: 30px; width: 33px; line-height: 30px; text-align: center; margin-right: 10px; font-size: 24px; border: 2px solid #666; color: #666; } .lk_meny_active ul li a:hover:before { border: 2px solid #2FC7A9; color: #2FC7A9; } .lk_meny_active ul li.current.active a:before { border: 2px solid #FFF; color: #FFF; } .bbcode { display: none !important; } #comments-form p:nth-child(2) { display: none !important; } .lk_meny_active_no, .lk_meny_active_no span { color: #DBDBDB !important; } .lk_meny_active_no:before { color: #DBDBDB !important; border: 1px solid #DBDBDB !important; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="vt_moduletable clearfix moduletable lk_meny_active"> <div class="vt_box clearfix"> <ul class="menu" style="display: block;"> <li id="item-110"> <a href="/index.php/obem-raboty"> <span> Объем работы</span> </a> </li> <li id="item-111"> <a href="/index.php/rabota-v-gruppe-vk"> <span> Работа в группе ВК</span> </a> </li> <li class="current active" id="item-112"> <a href="/index.php/ceremonial"> <span> Церемониал</span> </a> </li> <li id="item-113"> <a href="index.php"> <span> Размещение сообщения</span> </a> </li> <li id="item-114"> <a href="index.php"> <span> Назначение знакомства</span> </a> </li> </ul> </div> </div>

  • you're wrong. This code does not take li with these id and sets them a class - Grundy
  • In addition, you need to add to the question an example of the html markup to which this script will be applied, indicating to which element and what should be applied in the end - Grundy
  • @Grundy, well, yes, he asks everyone who does not match, but how to choose the next element? - Anatoly
  • next is which one? (next will be in English - next) - Grundy
  • @Grundy, here is the html added - Anatoly

1 answer 1

Since you need to add an attribute and a class to all selected ones except the first one, you need to throw it out of the result set, you can use the slice function for this

For example:

 jQuery(window).load(function() { $(".lk_meny_active ul li:not('#item-110,#item-111,#item-112') a").slice(1).attr("disabled", "disabled").attr("href", "javascript:void(0)").addClass("lk_meny_active_no"); }); 
 .lk_meny_active ul { display: none; } .lk_meny_active ul li.current.active, .moduletablelk_balans ul li.current.active { background: #2FC7A9 !important; color: #FFF !important; } .lk_meny_active ul li.current.active a span, .moduletablelk_balans ul li.current.active a span { background: none; color: #FFF !important; } .lk_meny_active ul li:Hover, .moduletablelk_balans ul li:Hover { background: #F6F5F6; } .lk_meny_active ul li A, .moduletablelk_balans ul li A { background: none !important; font-size: 16px !important; } .lk_meny_active ul { counter-reset: li; } .lk_meny_active ul li a:before { display: inline-block; content: counter(li); counter-increment: li; padding: 0px; height: 30px; width: 33px; line-height: 30px; text-align: center; margin-right: 10px; font-size: 24px; border: 2px solid #666; color: #666; } .lk_meny_active ul li a:hover:before { border: 2px solid #2FC7A9; color: #2FC7A9; } .lk_meny_active ul li.current.active a:before { border: 2px solid #FFF; color: #FFF; } .bbcode { display: none !important; } #comments-form p:nth-child(2) { display: none !important; } .lk_meny_active_no, .lk_meny_active_no span { color: #DBDBDB !important; } .lk_meny_active_no:before { color: #DBDBDB !important; border: 1px solid #DBDBDB !important; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="vt_moduletable clearfix moduletable lk_meny_active"> <div class="vt_box clearfix"> <ul class="menu" style="display: block;"> <li id="item-110"> <a href="/index.php/obem-raboty"> <span> Объем работы</span> </a> </li> <li id="item-111"> <a href="/index.php/rabota-v-gruppe-vk"> <span> Работа в группе ВК</span> </a> </li> <li class="current active" id="item-112"> <a href="/index.php/ceremonial"> <span> Церемониал</span> </a> </li> <li id="item-113"> <a href="index.php"> <span> Размещение сообщения</span> </a> </li> <li id="item-114"> <a href="index.php"> <span> Назначение знакомства</span> </a> </li> </ul> </div> </div>