title: jQuery: How to create array with two values for each item
body: <p>I am new to jQuery and hope someone can help me with this and also provide a short explanation so that I can apply it for similar cases in the future. </p>
  
  <p>I have a large HTML page that is built dynamically. 
  The page contains several tables with certain <strong>divs that are editable</strong> (contenteditable=true). These divs all have the class <code>"editable"</code>.</p>
  
  <p>Now I would like to <strong>create an array for all these divs</strong> that contains their id and their content (text). </p>
  
  <p>So far I have the following which should create unique ids for these divs with an incrementing number but I am not sure on how to create the array for this. 
  Also, just out of curiosity, is there a certain term how to call such arrays with two values per item ?</p>
  
  <p><strong>My jQuery:</strong> </p>
  
  <pre><code>$('#btnSave').on('click', function(){
      var i = 0;
      $(this).closest('form').find('div.editable').each(function(){
          $(this).attr('id', 'ed' + i+1);
          if( ($(this).text != '') &amp;&amp; ($(this).text != ' ') ){
              $(this).addClass('edited');
          }
          i++;
      });
  });
  
  // my attempt for the array (perhaps the wrong approach):
  var arrEdited = new Array();
  $('div.edited').each(function(){
      arrEdited.push($.trim($(this).text()));
  });
  </code></pre>
  
  <p>Many thanks in advance, 
  Mike</p>