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>