title: Closing the div and again re-open when click on button
body: <p>I am having a scenario where when I click on "x" button the div shown in the screen shot (REGULAR 50ML) has to close and when I click on Topping button, again this div has to be re-opened. These values are dynamically generated. </p>
  
  <p>This is my code that I tried where <code>"div#"+id_attr_val+".Topping-details"</code> is div id, <code>".btn btn-sm topp "</code> is button class and <code>".topping-close"</code> is close class :</p>
  
  <pre><code>function setStuff(activateEvent, activateUi) {    
      var selectedeleemnt = activateUi.newHeader.text();
      var response = search(selectedeleemnt);
      if (selectedeleemnt != null &amp;&amp; activateUi.newPanel.html() == '') {
          var activateUiHTML = $("&lt;div class='inner-accordion'&gt;&lt;/div&gt;");
          activateUiHTML.append('&lt;div id="' + v_item_id + '" class="activateUiHTML"  data-role="collapsible"&gt;');
      }
  }
  
  function display() {
      toplevelcart += '&lt;section id="topping_tsection_'+id_attr_val+'"&gt;&lt;i id="topping-close" class="topping-close"&gt;&lt;/i&gt;';
      $("div#"+id_attr_val+".Topping-details").each(function(i) {          
          $(this).hide().delay(i * 1500).fadeIn(1500);
      });
      $('.topping-close').one('click', function() {
          $(this).closest("div#"+id_attr_val+".Topping-details").fadeOut();
      });
  }
  </code></pre>
  
  <p>I am able to close the div, but could not reopen the div. Please help me out.</p>