Lite Brite: Box and Blink not working


#1

Hi there,

I’ve been working on the Lite-Brite project, and I’m stuck at trying to get the boxes and blink to light up.

The “select color” classes are working, and they light up when you click on them, but the boxes and blink still won’t. I’ve compared the code to the hints, and can’t find anything different. Any ideas on what I did wrong?

function main() {
  var colorClass = '';
  
  $('.select-color').on('click', function() {
    var selectedColor = $(this).attr('.select-color');
    
    switch (selectedColor) {
      case 'select-color cyan not-selected':
        colorClass = 'cyan';
      break;
      case 'select-color yellow not-selected':
        colorClass = 'yellow';
      break;
      case 'select-color magenta not-selected':
        colorClass = 'magenta';
      break;
    }
    
    $(this).removeClass('not-selected');
    $(this).siblings().addClass('not-selected');
  });
  
  $('.box').on('click', function() {
    $(this).toggleClass(colorClass);
  });

  $('.toggle-blink').on('click', function() {
    if (colorClass) {
      $(this).toggleClass('opacity');
      setInterval(function() {
        $('.box.cyan, .box.yellow, .box.magenta').toggleClass('blink');
      }, 350);
    }
  });
  
}

$(document).ready(main);

Thanks in advanced!


#2

The above should be an attribute name, not value.

$(this).attr('class')

#3

That fixed it! Thank you so much!