javascript - Dynamically change css style by class name -
<p class="typea build1"> build 1 <div class="b">complete</div></p> <p class="typea build2"> build 2 <div class="b">incomplete</div></p> //about 6 or 7 more builds... i need access style of build# change display...all hidden hava java code creates string/s (ex. "build2" , "build3"). have string saved "tempkey" in java code.
then in javascript script:
var tempkey = "<%=tempkey%>"; document.getelementsbyclassname(tempkey).style.display = "block !important"; i have tried adding class "active" , had class have same style (block !important), plus number of different ways solve this. seems can't access element right using java string in javascript function.
edit:
i accessing right element, won't let me overwrite display style none block. reason !important not working...
remember selector returns array need supply index [0].
var = 3; var tempkey = "build" + i; var el = document.getelementsbyclassname(tempkey)[0]; el.style.backgroundcolor = "#ffcc00"; ul.type-list { list-style-type:none; padding:0; } ul.type-list li.typea { border-bottom: 2px solid #99aacc; } ul.type-list li span.b { display:inline-block; width: 100px; float:right; } <ul class='type-list'> <li class="typea build1">build 1 <span class="b">complete</span> </li> <li class="typea build2">build 2 <span class="b">incomplete</span> </li> <li class="typea build3">build 3 <span class="b">build3</span> </li> <li class="typea build4">build 4 <span class="b">build4</span> </li> </ul>
Comments
Post a Comment