title: Detach and Attach div as a dialog in jquery
body: <p>I have a div with some id that contains some buttons/labels. Its a container itself. I want to have a button that when user clicks on the button a dialog has to appear with the same div but the div has to disappear from the page. So when Detach button is clicked a dialog appears with that div and button changes into Attach. When attach is clicked dialog disappears and regular div appears on the page.</p>
  
  <p>This is what i tried so far, it works only when Detach is clicked, if Attach is clicked dialog closes but regular div does not show up.</p>
  
  <pre><code>   $(document).on('click', '#detach', function() {
        var button = $(this).text();
            if (button == 'Detach') {
             $('.search_div_box').dialog({ autoOpen: false, width: 700 });
             $('.search_div_box').dialog('open');
                $(this).html('Attach');
            } else if (button == 'Attach') {
               $('.search_div_box').dialog('close');
               $(this).html('Detach');
            }
  
        });
  </code></pre>
  
  <p>i know im missing a code in Attach part it only closes the dialog but i tried various things like appending to body again the div and so on but didnt work. Thank you</p>