javascript - how to add class to tag when i click on it

Question

I need to add class="active" to tag <li> when i click on <a> to become <li class="active">

Notice i have multiple <li> tags and i need to class="active" only for tag <li> that i clicked on it.

this my sample code :

<ul class="nav">
<li>
   <a href="...">
    Personal Informations <i class="pe-7s-user"></i>
   </a>
</li>
<li>
   <a href="...">
    Qualifications <i class="pe-7s-note2"></i>
   </a>                              
</li>
</ul>

Answer 1

Use .parent() and .addClass()

$(function(){

  $('a').click(function(e){
    e.preventDefault();
    $(this).parent().addClass('active');
  })
})

.active {
  background-color: orange;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="nav">
<li>
   <a href="#">
    Personal Informations <i class="pe-7s-user"></i>
   </a>
</li>
<li>
   <a href="#">
    Qualifications <i class="pe-7s-note2"></i>
   </a>                              
</li>
</ul>