title: JQuery Drag and Drop: Accessing Sortable() Divs
body: <p>I have implemented the JQuery Drag and Drop plug in into my web site. It works great, however, I am trying to access a div that is being sorted but find great difficulty selecting it.</p>
  
  <p>So, I am trying to select each "dragbox" inside each column. This is usually simple work but for some reason I can't access it and can't see it in FireBug.</p>
  
  <p>Does anyone have any ideas how I can access the "dragbox" items inside the cols using a loop? Thanks all!</p>
  
  <p>EDIT:</p>
  
  <p>I have also used find() and it did not work</p>
  
  <pre><code>   &lt;div class="column" id="col1"&gt;   
  
          &lt;div class="dragbox" id="item1" &gt;   
              control goes here
          &lt;/div&gt;
          &lt;div class="dragbox" id="item1" &gt;   
              &lt;!-- control goes here --&gt;
          &lt;/div&gt;
    &lt;/div&gt;
  
  
    &lt;div class="column" id="col2"&gt;            
          &lt;div class="dragbox" id="item3" &gt;   
             &lt;!-- control goes here --&gt;
          &lt;/div&gt;
     &lt;/div&gt;
  </code></pre>
  
  <p>I am using the following JQuery:</p>
  
  <pre><code>$('.column').sortable({
          connectWith: '.column',
          handle: '.widget-header-holder',
          cursor: 'move',
          placeholder: 'placeholder',
          forcePlaceholderSize: true,
          opacity: 0.4,
          stop: function(event, ui) {
              $(ui.item).find('.widget-header-holder').click();
              var sortorder = '';
              $('.column').each(function() {
                  var itemorder = $(this).sortable('toArray');
                  var columnId = $(this).attr('id');
                  sortorder += columnId + '=' + itemorder.toString() + '&amp;';
              });
              /*alert('SortOrder: ' + sortorder);*/
              console.log(sortorder);                
          }
      });
  </code></pre>