title: Adding HTML code using for loop in jquery
body: <p>I'm trying to add li elements in a html codes to a div element, following is my html code:</p>
  
  <p><strong>Place where the elements to be added:</strong></p>
  
  <pre><code>&lt;div class="form-body" id="nitspopupmenu"&gt;&lt;/div&gt;
  </code></pre>
  
  <p><strong>Elements of ul:</strong></p>
  
  <pre><code>&lt;div class="collapse navbar-collapse"&gt;
      &lt;ul class="nav navbar-nav navbar-right" id="nitsmenu" data-nitspagelabel="1"&gt;
          &lt;li class="scroll active"&gt;&lt;a href="#navigation"&gt;Home&lt;/a&gt;&lt;/li&gt;
          &lt;li class="scroll"&gt;&lt;a href="#aboutus"&gt;About Us&lt;/a&gt;&lt;/li&gt;
          &lt;li class="scroll"&gt;&lt;a href="#services"&gt;Services&lt;/a&gt;&lt;/li&gt;
          &lt;li class="scroll"&gt;&lt;a href="#ourteam"&gt;Our Team&lt;/a&gt;&lt;/li&gt;
          &lt;li class="scroll"&gt;&lt;a href="#portfolio"&gt;Portfolio&lt;/a&gt;&lt;/li&gt;
          &lt;li class="scroll"&gt;&lt;a href="#clients"&gt;Clients&lt;/a&gt;&lt;/li&gt;
          &lt;li class="scroll"&gt;&lt;a href="#blog"&gt;Blog&lt;/a&gt;&lt;/li&gt;
          &lt;li class="scroll"&gt;&lt;a href="#contact"&gt;Contact&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>My Jquery code:</strong></p>
  
  <pre><code>$(e).fadeIn(400);
  
  $('#nitspagesorter').fadeIn(400).css({
      'top': mouseY,
      'left': mouseX
  }).draggable();
  
  $('#nitsmenubutton').hide();
  
  var licount = $("#nitsmenu li").length;
  for (i = 0; i &lt; licount; i++) {
      var lielem = $("#nitsmenu li").text();
      var element = $(lielem).text();
      $("#nitspopupmenu").html("&lt;div class='form-group'&gt;&lt;div class='pagesmenu selected'&gt;&lt;span&gt;&lt;i class ='fa fa-bars'&gt;&lt;/i&gt;" + lielem + "");
  }
  </code></pre>
  
  <p>I'm poping up the content to popup box, I'm getting the <code>li</code> name properly but its showing only the last element i.e. Contact, 
  <code>$("#nitspopupmenu").html("&lt;div class='form-group'&gt;&lt;div class='pagesmenu selected'&gt;&lt;span&gt;&lt;i class ='fa fa-bars'&gt;&lt;/i&gt;" + lielem + "");</code> is executing at last or might be replacing the content everytime and showing the last result</p>
  
  <p>Please help</p>