jQuery的.removeClass上<tr>

Question

追加失败之前看到的jsfiddle

https://jsfiddle.net/codenoob/3v3mfndg/1/

我有一个表，它是隐藏的。我将其设置为克隆更多行的模板。

但是我想删除隐藏的类，当追加新行但不能。

它可以将所有元素的<tr>

测试后，通过从<tr>隐藏类removeClass和运行代码。

我做错了什么？

如果你不能使用的jsfiddle这里的代码

HTML

<table id="cloneinhere"> 
    <tbody> 
    <tr id="clone" class="hidden"> 
     <td> 
     <text id="redtext" class="red">hi</text> 
     </td> 
    </tr> 
    </tbody> 
</table> 
<button id="clonebtn"> 
    add row 
</button> 

jQuery的

var original = $('#clone'); //get html for the sample row 

$('#clonebtn').click(function() { 
var clone = original.clone(); 
    clone.find('#clone').removeClass("hidden"); 
    clone.find('#redtext').removeClass("red"); 
    $('#cloneinhere > tbody:last').append(clone); 
}); 

CSS

.hidden { 
    display: none; 
} 

.red{ 
    color: red; 
} 

Answer 1

检查下面的解决方案，将制定出适合你

$(function() { 
 
var original = $('#clone'); //get html for the sample row 
 

 
$('#clonebtn').click(function() { 
 
var clone = original.clone(); 
 
clone.removeClass("hidden"); 
 
    clone.find('#redtext').removeClass("red"); 
 
    $('#cloneinhere > tbody:last').append(clone); 
 
}); 
 
});

.hidden { 
 
    display: none; 
 
} 
 

 
.red{ 
 
    color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table id="cloneinhere"> 
 
    <tbody> 
 
    <tr id="clone" class="hidden"> 
 
     <td> 
 
     <text id="redtext" class="red">hi</text> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 
<button id="clonebtn"> 
 
    add row 
 
</button>