итерации через элементы li .addclass css на некоторых элементах li

Question

Я выполняю итерацию через элементы li, а затем применяю css для некоторых элементов li, соответствующих моим критериям.

позволяет сказать, что у меня есть 15 в общей сложности Li элементов в ул тогда я CSS класс с помощью JavaScript .addclass hide_me на количестве Li 11 до 15.

это HTML:

<ul> 
    <li>item 1</li> 
    <li>item 2</li> 
    <li>item 3</li> 
    <li>item 4</li> 
    <li>item 5</li> 
    <li>item 6</li> 
    <li>item 7</li> 
    <li>item 8</li> 
    <li>item 9</li> 
    <li>item 10</li> 
    <li>item 11</li> 
    <li>item 12</li> 
    <li>item 13</li> 
    <li>item 14</li> 
    <li>item 15</li> 
</ul> 

это я хочу сделать с помощью JavaScript/JQuery

<ul> 
    <li>item 1</li> 
    <li>item 2</li> 
    <li>item 3</li> 
    <li>item 4</li> 
    <li>item 5</li> 
    <li>item 6</li> 
    <li>item 7</li> 
    <li>item 8</li> 
    <li>item 9</li> 
    <li>item 10</li> 
    <li class="hide_me">item 11</li> 
    <li class="hide_me">item 12</li> 
    <li class="hide_me">item 13</li> 
    <li class="hide_me">item 14</li> 
    <li class="hide_me">item 15</li> 
</ul> 

Пока я придумал этот код JavaScript, но он не работает.

мой Javascript:

<script> 
$(document).ready(function(){ 
    $.each($('.items'), function() { 
     var children = $(this).find(">li"); 
     var count_items = children.length; 

     for (var items = 11; items < count_items; items++) { 
     //console.log(items); //output 11, 12, 13, 14, 15 
     $(".items li:nth-of-type("+ items +")").addClass('.hideme'); // this is css selector by nth-type 
     } 
    }); 
}); 
</script> 

Answer 1

$('ul li:gt(9)').addClass('addedclass')

.addedclass{color:red}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
    <li>item 1</li> 
 
    <li>item 2</li> 
 
    <li>item 3</li> 
 
    <li>item 4</li> 
 
    <li>item 5</li> 
 
    <li>item 6</li> 
 
    <li>item 7</li> 
 
    <li>item 8</li> 
 
    <li>item 9</li> 
 
    <li>item 10</li> 
 
    <li>item 11</li> 
 
    <li>item 12</li> 
 
    <li>item 13</li> 
 
    <li>item 14</li> 
 
    <li>item 15</li> 
 
</ul>

1. Используйте :gt() селектор. Нет необходимости повторять литиево
2. начало Индекс на 0

Описание: Выбрать все элементы с индексом выше, чем показатель в пределах согласованного набора.

Answer 2

Попробуйте

$("li").each(function(k,v){ 
    if(k>9) 
    $(this).addClass("hide-me"); 
}); 

// Apply css on class applied 

$(".hide-me").css({ 'color':'red'}); 

https://jsfiddle.net/sum1/yzubc169/