title: Adding attribute to Link via jQuery
body: <p>I have the following HTML:</p>
  
  <pre><code>&lt;div class="navv"&gt;
  &lt;ul&gt;
  &lt;li&gt;&lt;a href="#"&gt;HOME&lt;/a&gt;&lt;/li&gt;
  &lt;li class="dropdown"&gt;&lt;a href="#"&gt;MAPPING&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>What I want is to loop through each "li" and then add an attribute to that particular Link "a href" inside the "li" which has the class "dropdown"</p>
  
  <p>I have managed to work it out till:</p>
  
  <ul>
  <li>looping through each "li"</li>
  <li>I have also managed to check that the "li" has a class 'dropdown'</li>
  </ul>
  
  <p><strong>The only part left is that I cannot manage to add a new attribute to the 'a href' for that particular 'li' that has the class 'dropdown'</strong></p>
  
  <p>This is what I have tried so far:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(document).ready(function(){
      $(".navv ul li").each(function(index){
          if($(this).hasClass('dropdown')){
           // Adding a new attribute to the link tag  
           // referring to the particular "li" and "a" inside it and adding attribute, but this doesen't work.
           $(this).("a").attr('data-toggle','dropdown');    
          }
      })
  });
  &lt;/script&gt;
  </code></pre>