Pobierz element według indeksu w jQuery

Mam nieuporządkowaną listę i indeks liznacznika na tej liście. Muszę pobrać lielement za pomocą tego indeksu i zmienić jego kolor tła. Czy jest to możliwe bez zapętlania całej listy? To znaczy, czy jest jakaś metoda, która mogłaby osiągnąć taką funkcjonalność?

Oto mój kod, który moim zdaniem zadziała ...

<script type="text/javascript">
  var index = 3;
</script>

<ul>
    <li>India</li>
    <li>Indonesia</li>
    <li>China</li>
    <li>United States</li>
    <li>United Kingdom</li>
</ul>

<script type="text/javascript">
  // I want to change bgColor of selected li element
  $('ul li')[index].css({'background-color':'#343434'});

  // Or, I have seen a function in jQuery doc, which gives nothing to me
  $('ul li').get(index).css({'background-color':'#343434'});
</script>

$(...)[index]      // gives you the DOM element at index
$(...).get(index)  // gives you the DOM element at index
$(...).eq(index)   // gives you the jQuery object of element at index

Obiekty DOM nie mają cssfunkcji, użyj ostatniego ...

$('ul li').eq(index).css({'background-color':'#343434'});

dokumenty:

.get(index) Zwroty: Element

• Opis: pobierz elementy DOM dopasowane przez obiekt jQuery.
• Zobacz: https://api.jquery.com/get/

.eq(index) Zwraca: jQuery

• Opis: zmniejsz zestaw dopasowanych elementów do tego o określonym indeksie.
• Zobacz: https://api.jquery.com/eq/

Możesz użyć .eq()metody jQuery, aby uzyskać element o określonym indeksie.

$('ul li').eq(index).css({'background-color':'#343434'});

Możesz użyć metody eq lub selektora :

$('ul').find('li').eq(index).css({'background-color':'#343434'});

Istnieje inny sposób uzyskania elementu po indeksie w jQuery przy użyciu :nth-of-typepseudoklasy CSS :

<script>
    // css selector that describes what you need:
    // ul li:nth-of-type(3)
    var selector = 'ul li:nth-of-type(' + index + ')';
    $(selector).css({'background-color':'#343434'});
</script>

Istnieją inne selektory , których możesz użyć z jQuery, aby dopasować dowolny element, którego potrzebujesz.

Możesz pominąć jquery i po prostu użyć tagowania w stylu CSS:

 <ul>
 <li>India</li>
 <li>Indonesia</li>
 <li style="background-color:#343434;">China</li>
 <li>United States</li>
 <li>United Kingdom</li>
 </ul>