Javascript: Onload, if checked, change li class

Question

I have this code on the javascript side:

function changeSelectionStyle(id) {
    if(document.getElementById(id).className != 'yes'){
    document.getElementById(id).className = 'yes';
    }
    else{document.getElementById(id).className = '';}
}

And this is on html:

<ul>
  <li id="selectedAuthorities-4_1li" class="">
    <input type="checkbox" id="selectedAuthorities-4_1" name="selectedAuthorities" value="ROLE_ADD_COMMENT_TO_CV" checked="checked" onload="changeSelectionStyle(this.id + 'li');" onclick="changeSelectionStyle(this.id + 'li'); checkFatherSelection(this.id);">

    <a href="#" onclick="document.getElementById('selectedAuthorities-4_1').click(); return false;">  Agregar comentario <samp><b></b>Permite agregar comentario en el detalle.</samp>
    </a>
 </li> 

It’s good that I can’t get the job done when the checkbox is checked, when loading JS I have to check it and assign it to class="yes“li, here:<li id="selectedAuthorities-4_1li" class="">

What should I add to my original JS function to make this possible. Please note that the leads are not static, they are dynamic, html li id ​​is generated.

Process for solving (logic):

, , X, , JS changeSelectionStyle. , , , ( ), li , / , , ( - )

Answer 1

window.onload=function(){
var inputFields=document.getElementsByTagName('input');
var checkBoxes[];
for(var i=0;i<inputFields.length;i++)
 if(inputFields[i].type=='checkbox'&&inputFields[i].checked=='checked'&& inputFields[i].parentNode.tagName=='LI')
inputFields[i].parentNode.className='yes';
}

..