jQuery change css by index

Question

I want to change the css of an element by jQuery index.

 $(".switcher span").click(function() {
   var galleryIndex = $(this).index();
   $('.wrapper .gallery').eq(galleryIndex).css("background", "red");
 });

<div class="switcher">
  <span>Switch 0</span>
  <span>Switch 1</span>
</div>

<div class="wrapper">
  <div class="gallery">GALLERY 0</div>
  <div class="gallery">GALLERY 1</div>
</div>

jQuery gets the index of the .switcher span fine but it seems that the index pf the gallery is not loading. It does not work so far.

Working fine for me... Do share executable snippet....

Rayon
– Rayon

2016-11-24 12:11:25 +00:00
Commented Nov 24, 2016 at 12:11 — Rayon
– Rayon, Commented Nov 24, 2016 at 12:11
working fine jsfiddle.net/nu4ngh31

Satpal
– Satpal

2016-11-24 12:12:03 +00:00
Commented Nov 24, 2016 at 12:12 — Satpal
– Satpal, Commented Nov 24, 2016 at 12:12

Dekel · Accepted Answer · 2016-11-24 12:12:24Z

1

It seems like everything works great in your code.

If you want to reset the background-color on every click you can set it to '':

$(".switcher span").click(function(){
      var galleryIndex = $(this).index();
      $('.wrapper .gallery').css('background', '').eq(galleryIndex).css("background", "red");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<div class="switcher">
    <span>Switch 0</span>
    <span>Switch 1</span>
</div>

<div class="wrapper">
    <div class="gallery">GALLERY 0</div>
    <div class="gallery">GALLERY 1</div>
</div>

answered Nov 24, 2016 at 12:12

Dekel

62.9k12 gold badges109 silver badges130 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jQuery change css by index

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related