title: JQuery .change() function within .each() function
body: <p>I'm using JQuery Sortable UI Where I need to track current position array of <code>&lt;li&gt;</code> Here is code</p>
  
  <pre><code>$(document).ready(function() {
      $('#sortable').sortable({
          update: function(event, ui) {
  
              $('#sortable').children().each(function(i) {
                  var id = $(this).attr('data-post-id')
                      ,order = $(this).index() + 1;
  
                  $('#console').val($('#console').val() + '' + id + '' + ',');
  
              });
  
          }
      });
  });
  </code></pre>
  
  <p>&amp; here is HTML </p>
  
  <pre><code>&lt;ul id="sortable"&gt;
      &lt;li data-post-id="1"&gt;Post 1&lt;/li&gt;
      &lt;li data-post-id="2"&gt;Post 2&lt;/li&gt;
      &lt;li data-post-id="3"&gt;Post 3&lt;/li&gt;
      &lt;li data-post-id="4"&gt;Post 4&lt;/li&gt;
      &lt;li data-post-id="5"&gt;Post 5&lt;/li&gt;
      &lt;li data-post-id="6"&gt;Post 6&lt;/li&gt;
      &lt;li data-post-id="7"&gt;Post 7&lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;input id="console" type="text" /&gt;
  </code></pre>
  
  <p>On sorting, I want current position array of <code>&lt;li&gt;</code> to be printed inside input area.</p>
  
  <p>This code works fine except : </p>
  
  <p>On .each() sorting, arrays are <strong>appending</strong> within input area. What I want is to <strong>Replace</strong> previous arrays with new arrays</p>
  
  <p>Here is <a href="http://jsfiddle.net/TbR69/20/" rel="nofollow">Fiddle</a> that will give you an Idea of what I'm talking about.</p>
  
  <p>I tried wrapping inside .change() function but I'm not getting it correctly.</p>
  
  <p>Any help would be appreciated!</p>
  
  <p>Thanks</p>