更新CSS onDomReady嵌套複選框

Question

我有一個從數據庫加載正確的數據的一些嵌套的複選框，但是我想就劃掉的文本標籤被選中的人。它對第二級複選框工作正常，但我一直無法使第一級複選框正常工作。

您可以在這裏看到的錯誤：

http://jsfiddle.net/Zfv7h/3/

$(document).ready(function() { 
    $(".content-finalized").each(function() { 
    if ($(this).attr("checked")) { 
    $(this).closest("li").css("text-decoration", "line-through"); 
    } 
    }); 
    $(".subchapter-finalized").each(function() { 
    if ($(this).attr("checked")) { 
     $(this).closest("li").css("text-decoration", "line-through"); 
    } 
    }); 
}); 

感謝您的幫助。

Answer 1

修訂ANSWER

更改你的Javascript這個

$(document).ready(function() { 
    $("input.content-finalized:checkbox:checked").next('span').css("text-decoration", "line-through"); 
    $("input.subchapter-finalized:checkbox:checked").parent().css("text-decoration", "line-through"); 
}); 

我不得不稍微改變你的HTML標記。我所做的只是將章節包裝在一個。 這是爲什麼。當我將css行應用到父<li>時，它也將它應用到它的孩子，即使我將文本裝飾指定爲none以查看未檢查的元素。所以，現在，而不是把它應用到父<li>，我把它應用到<span>代替。

Here's an updated fiddle