Count previous items

Navigation
1

Good morning, gentlemen,

I need to count elements of a li and add those values dynamically by counting the previous li elements: 

 <div class="conteudo">
            <ul>
                <li><i class="indice">1 - </i>Conteudo 1</li>
                <li><i class="indice">2 - </i>Conteudo 2</li>
                <li><i class="indice">3 - </i>Conteudo 3</li>
                <li><i class="indice">4 - </i>Conteudo 4</li>
                <li><i class="indice">5 - </i>Conteudo 5</li>
                <li><i class="indice">6 - </i>Conteudo 6</li>
            </ul>
        </div>
The idea is that the 'i' elements of the class="index" receive each one's index dynamically. As I am new to jquery I am having difficulty performing this function, would anyone have an idea how I can solve this? Hug to everyone!     
asked by anonymous 27.07.2015 / 16:43

1 answer

3

$(function(){


  $('#add').click(function(){
      var count = $("ul").children().length;
      $('ul').append('<li><i class="indice" rel="'+(count+1)+'" >'+(count+1)+' - </i>Conteudo '+(count+1)+'</li>');
  });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divclass="conteudo">
  <ul>
    <li><i class="indice" rel="1" >1 - </i>Conteudo 1</li>
    <li><i class="indice" rel="2" >2 - </i>Conteudo 2</li>
    <li><i class="indice" rel="3" >3 - </i>Conteudo 3</li>
    <li><i class="indice" rel="4" >4 - </i>Conteudo 4</li>
    <li><i class="indice" rel="5" >5 - </i>Conteudo 5</li>
    <li><i class="indice" rel="6" >6 - </i>Conteudo 6</li>
  </ul>
  
  <button id="add">Adicionar</button>
</div>
    
27.07.2015 / 16:59
Undefined error while reading 'post' property in AngularJS Encoding ASP Classic