Question

我有多个div，我想删除我点击的名为“inactive”的类。我尝试了很多但找不到任何解决方案。我的html div的代码如下：

<ul class="job-tile">
    <li><div class="clock1 inactive" id='clock1'></div></li>
    <li><div class="clock1 inactive" id='clock1'></div></li>
    <li><div class="clock1 inactive" id='clock1'></div></li>
    <li><div class="clock1 inactive" id='clock1'></div></li>
    <li><div class="clock1 inactive" id='clock1'></div></li>
  </ul>

我的js代码如下所示：

 $('ul li').click(function() 
        {

        if ($(".clock1")){
          $(this).closest('clock1').removeClass('inactive');
        }
    });

我被困在那里。任何想法如何解决这个问题？

Answer 1

你可以试试这个：

$( 'ul li' ).click( function() {
    $( this ).find( '.clock1' ).removeClass( 'inactive' );
});

Answer 2

$('ul.job-tile > li > div').click(function(){
  if($(this).hasClass('inactive')){
    $(this).removeClass('inactive');
  }
});

Answer 3

你可以试试这个：

首先Don't use same id's for different element并更正HTML add closing div tag：

<ul class="job-tile">
    <li><div class="clock1 inactive" id='clock1'></div></li>
    <li><div class="clock1 inactive" id='clock2'></div></li>
    <li><div class="clock1 inactive" id='clock3'></div></li>
    <li><div class="clock1 inactive" id='clock4'></div></li>
    <li><div class="clock1 inactive" id='clock5'></div></li>
</ul>

Jquery的：

$('ul li').click(function() 
 {        
   if ($(this).find('div').hasClass('clock1')){
       $(this).find('div.clock1').removeClass('inactive');
   }
 });

Working fiddle

<强>更新

您可以使用.addClass()

$('ul li').click(function() 
 {        
     if ($(this).find('div').hasClass('clock1')){   
        $(this).find('div.clock1').removeClass('inactive');
        $(this).prevAll().find('div.clock1').addClass('inactive');//-- All previous li's
        $(this).nextAll().find('div.clock1').addClass('inactive');//-- All next li's
     }
 });

Working example

如何使用js删除当前类？

3 个答案: