title: Remove the collapse/expand function if the parent element doesn't have child
body: <p>I'm using the Nestable code (<a href="https://dbushell.com/Nestable/" rel="nofollow noreferrer">https://dbushell.com/Nestable/</a>). In the list, the user can drag and drop the items until level 2. Basically, the item can have a father, in maximum.</p>
  
  <p>If the item has child, this item show the expand and collapse functions. When the item does not have child, this item doesn't show the expand and collapse functions.</p>
  
  <p>And I have created a function to remove items.</p>
  
  <p>So, when I delete the child item and the parent item doesn't have any child, the collapse and expand functions don't disappear. These functions should be disappear.</p>
  
  <p><a href="https://jsfiddle.net/marcelpsaraiva/8p3ntu91/" rel="nofollow noreferrer">JSFiddle</a></p>
  
  <p><a href="https://i.stack.imgur.com/LRSKT.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/LRSKT.png" alt="enter image description here"></a>
  <a href="https://i.stack.imgur.com/BHQgf.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/BHQgf.png" alt="enter image description here"></a></p>
  
  <p>The code:</p>
  
  <pre><code>&lt;div class="dd" id="nestable"&gt;
              &lt;ol class="dd-list outer"&gt;
                  &lt;li class="dd-item" data-id="1"&gt;
                      &lt;button class='dd-action pull-right' type='button' data-action='remove' title='Remove'&gt;&lt;i class='icon-remove'&gt;&lt;/i&gt;&lt;/button&gt;
                      &lt;div class="dd-handle"&gt;Item 1&lt;/div&gt;
                  &lt;/li&gt;
                  &lt;li class="dd-item" data-id="2"&gt;
                      &lt;button class='dd-action pull-right' type='button' data-action='remove' title='Remove'&gt;&lt;i class='icon-remove'&gt;&lt;/i&gt;&lt;/button&gt;
                      &lt;div class="dd-handle"&gt;Item 2&lt;/div&gt;
                      &lt;ol class="dd-list"&gt;
                          &lt;li class="dd-item" data-id="4"&gt;
                              &lt;button class='dd-action pull-right' type='button' data-action='remove' title='Remove'&gt;&lt;i class='icon-remove'&gt;&lt;/i&gt;&lt;/button&gt;
                              &lt;div class="dd-handle"&gt;Item 4&lt;/div&gt;
                          &lt;/li&gt;
                          &lt;li class="dd-item" data-id="9"&gt;
                              &lt;button class='dd-action pull-right' type='button' data-action='remove' title='Remove'&gt;&lt;i class='icon-remove'&gt;&lt;/i&gt;&lt;/button&gt;
                              &lt;div class="dd-handle"&gt;Item 9&lt;/div&gt;
                          &lt;/li&gt;
                          &lt;li class="dd-item" data-id="10"&gt;
                              &lt;button class='dd-action pull-right' type='button' data-action='remove' title='Remove'&gt;&lt;i class='icon-remove'&gt;&lt;/i&gt;&lt;/button&gt;
                              &lt;div class="dd-handle"&gt;Item 10&lt;/div&gt;
                          &lt;/li&gt;
                      &lt;/ol&gt;
                  &lt;/li&gt;
                  &lt;li class="dd-item" data-id="11"&gt;
                      &lt;button class='dd-action pull-right' type='button' data-action='remove' title='Remove'&gt;&lt;i class='icon-remove'&gt;&lt;/i&gt;&lt;/button&gt;
                      &lt;div class="dd-handle"&gt;Item 11&lt;/div&gt;
                  &lt;/li&gt;
                  &lt;li class="dd-item" data-id="12"&gt;
                      &lt;button class='dd-action pull-right' type='button' data-action='remove' title='Remove'&gt;&lt;i class='icon-remove'&gt;&lt;/i&gt;&lt;/button&gt;
                      &lt;div class="dd-handle"&gt;Item 12&lt;/div&gt;
                  &lt;/li&gt;
              &lt;/ol&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>$(document).ready(function()
  {
  
      var updateOutput = function(e)
      {
          var list   = e.length ? e : $(e.target),
              output = list.data('output');
          if (window.JSON) {
              output.val(window.JSON.stringify(list.nestable('serialize')));
          } else {
              output.val('JSON browser support required for this demo.');
          }
      };
  
      // activate Nestable for list 1
      $('#nestable').nestable({
          group: 1,
          expandBtnHTML   : '&lt;button class="dd-action" data-action="expand" type="button"&gt;&lt;i class="icon-chevron-right"&gt;&lt;/i&gt;&lt;/button&gt;',
          collapseBtnHTML : '&lt;button class="dd-action" data-action="collapse" type="button"&gt;&lt;i class="icon-chevron-down"&gt;&lt;/i&gt;&lt;/button&gt;',
          customActions   : {
              'remove'    : function(item,button) {
                              item.remove();
                          }
          }
      })
      .on('change', updateOutput);
  
      // output initial serialised data
      updateOutput($('#nestable').data('output', $('#nestable-output')));
  
      $('#nestable-menu').on('click', function(e)
      {
          var target = $(e.target),
              action = target.data('action');
          if (action === 'expand-all') {
              $('.dd').nestable('expandAll');
          }
          if (action === 'collapse-all') {
              $('.dd').nestable('collapseAll');
          }
      });
  
  });
  </code></pre>