title: jQuery append dict to html, how to insert a auto-incrementing id from 1
body: <p>How to insert a auto-incrementing <code>id</code> from 1 before <code>info.name</code> in jQuery? I use below code to get aggregated data, for example, each <code>quessionId</code> has many related <code>reasons</code>. Below is my partial code of <code>.js</code> code in jQuery:</p>
  <pre><code>function fmtQuestionsByID(id,callback){
      if(!DATA.questions[id] || !$('#card_'+id) )return;
      var project = DATA.projects[DATA.questions[id].projectId];
      if(!project)return;
      
      var issueQuestionLists = DATA.alltags.reduce(function(a,b){
          if(a[b['quessionId']]) {
              a[b['quessionId']].push({name:b['name'],color:b['color'],description:b['description'],reason:b['reason'],question:b['question'],issueId:b['issueId'],department:b['department'],_id:b['quessionId']})
          } else{
              a[b['quessionId']] = [{name:b['name'],color:b['color'],description:b['description'],reason:b['reason'],question:b['question'],issueId:b['issueId'],department:b['department'],_id:b['quessionId']}]
          }
          return a;
      },{});
      for(var i=0;i &lt; DATA.questions[id].tags.length;i++){
          var lid = DATA.questions[id].tags[i];
  
          for(var l in issueQuestionLists){
              var lb = issueQuestionLists[l]
              for(var c=0;c&lt; lb.length;c++){
                  var lc = lb[c];
                  if(lc._id == lid){
                      var info = lc;
                      console.log('info', info);
                      $('.tags_question').append('['+info.name+']' + info.description + '。' +  'Reason: '+info.reason+ '。' ||'[no data]' );
                  }
              }
  
          }
      }
  }
  </code></pre>
  <p><a href="https://i.stack.imgur.com/mjpD7.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/mjpD7.jpg" alt="enter image description here" /></a></p>
  <p>And I use below html to get above data</p>
  <pre><code>&lt;div id=&quot;questioninfo&quot;&gt;
      &lt;span class=&quot;tags_question&quot;&gt;&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  <p>In the console, I do have those dictionaries, but why the page only get one dict?</p>
  <p>Thanks so much for any help.</p>
  <p>Thanks so much for Swati's help, to change <code>.html</code> to <code>.append</code>.</p>