appending a class to an element based on its data-html using javascript -


i want append class 'activetab' tag on document ready. need select tag it's data-html i'm not sure how this.

so how html loads currently:

<ul class="tabbedgroupings_tabs">   <li class="tg_tab" data-html="academicprofessionalanddevelopment">academic, professional , development</li>   <li class="tg_tab" data-html="cultural">cultural</li>   <li class="tg_tab" data-html="physicalactivityandperformance">physical activity , performance</li>   <li class="tg_tab" data-html="politicsreligionandcampaigning">politics, religion , campaigning</li>   <li class="tg_tab" data-html="society">society</li>   <li class="tg_tab" data-html="specialinterest">special interest</li>   <li class="tg_tab" data-html="all">all</li> </ul> 

i add 'activetab' class data-html="all" element.

you can use jquery attribute selector. $("[attribute]") , selects elements have specified attribute value equal value.attribute-equals-selector

$(document).ready(function() {    $(".tabbedgroupings_tabs > [data-html='all']").addclass('activetab');  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <ul class="tabbedgroupings_tabs">    <li class="tg_tab" data-html="academicprofessionalanddevelopment">academic, professional , development</li>    <li class="tg_tab" data-html="cultural">cultural</li>    <li class="tg_tab" data-html="physicalactivityandperformance">physical activity , performance</li>    <li class="tg_tab" data-html="politicsreligionandcampaigning">politics, religion , campaigning</li>    <li class="tg_tab" data-html="society">society</li>    <li class="tg_tab" data-html="specialinterest">special interest</li>    <li class="tg_tab" data-html="all">all</li>  </ul>


Comments

Popular posts from this blog

Spring Boot + JPA + Hibernate: Unable to locate persister -

go - Golang: panic: runtime error: invalid memory address or nil pointer dereference using bufio.Scanner -

c - double free or corruption (fasttop) -