vendredi 21 août 2015

Copy parent's class to it's parent's parent's class if checkbox is checked with jQuery

Examples

Before:

<ul>    
    <li class="cat-item cat-item-1">
        <input type="checkbox" id="1"></li>
    <li class="cat-item cat-item-2 current-cat">   
        <input type="checkbox" id="2"></li>       <-checked
</ul>

I'd like to have "cat-item-#number#" in it's parent's class when it's also "current-cat" or when it's checkbox's state is checked. (checkbox can start checked by default)

After Jquery:

<ul class="cat-item-2"> 
    <li class="cat-item cat-item-1">
        <input type="checkbox" id="1"></li>
    <li class="cat-item cat-item-2 current-cat">
        <input type="checkbox" id="2"></li>       <-checked
</ul>

After checking the first checkbox:

<ul class="cat-item-1 cat-item-2">  
    <li class="cat-item cat-item-1">
        <input type="checkbox" id="1"></li>       <-checked
    <li class="cat-item cat-item-2 current-cat">
        <input type="checkbox" id="2"></li>       <-checked
</ul>

Then after unchecking the second checkbox:

<ul class="cat-item-1"> 
    <li class="cat-item cat-item-1">
        <input type="checkbox" id="1"></li>       <-checked
    <li class="cat-item cat-item-2 current-cat">
        <input type="checkbox" id="2"></li>
</ul>

How can I do it? I don't care if the first "cat-item" from class get's copied too.

Aucun commentaire:

Enregistrer un commentaire