jQuery - addClass not adding class to html element

I try to add CSS class to <li> element, when I click on the button but addClass not working.

Here is my JS:

$('.test').click(function(event) {
    var centrum1 = $('.p17');
    $('section.bok-map').find( centrum1 ).addClass('active-region');
});

And this how is looking HTML code: enter image description here

Where is the problem? find() returns true.
Here is demo: http://demo.vrs-factory.pl/mapDemo/

javascript jquery html css
kishan patel

Answers 1

Submit Answer
  • kishan patel

    You had a couple of errors, as you were not selecting the correct element, hence the length of the selector was 0.

    Firstly, the class is called pl7 not p17 and secondly, when using removeClass you don't put the . before the name of the class. As you are using removeClass it is understood that you want to target a class, hence not requiring you to specify this by adding the dot. 

     <script>
      var centrum1 = $('.pl7');

      $('.test').click(function(event) {            
          $('section.bok-map').find( centrum1 ).removeClass('pl7');
      });

 </script>

    Also, it may be worth noting that since you are only referencing$(.pl7) once you do not necessarily have to assign it to a variable. You could also write it as below. It is up to you. 

      $('.test').click(function(event) {            
       $('section.bok-map').find('.pl7').removeClass('pl7');
  });

Related Articles