title: id already registered dojo
body: <p>I have a TabContainer, to which I m adding ContentPanels. My requirement demands that, I reload this TabContainer(which different content in ContentPanels) everytime, I click a new row on grid(generated from ajax in the same page).
  Initially, when I got the problem that id is already registered, I used destroyRecursive, as seen in suggested in one of the answers here.
  Now, after using that, I m getting the following result:</p>
  
  <p>Result after I click on any of the row, the first time:
  Just like the way, I want, with the container and the 3 content panes.</p>
  
  <p>Result after I click on any of the row, the second time, and any other times:
  A new container with 3 content panes is placed on top of the old one with 3 content panes.
  No matter, how many rows I click, the result always has 2 containers, with new one placed above the old one. </p>
  
  <p>Below is the code, I have used.</p>
  
  <pre class="lang-html prettyprint-override"><code>    &lt;div id = "tabsContainer"&gt;
      &lt;div id="tabPanels" data-dojo-type = "dijit/layout/TabContainer"&gt;&lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <pre class="lang-javascript prettyprint-override"><code>  function getTabPanelsForTheRow() {
          require(["dijit/layout/TabContainer",
           "dijit/layout/ContentPane"], function (TabContainer, ContentPane) {
              var tc = new TabContainer({}, "tabPanels");
  
              var cp1 = new ContentPane({
                  title: "Contacts",
                  content: "These are the activities"
              });
              tc.addChild(cp1);
  
              var cp2 = new ContentPane({
                  title: "Activities",
                  content: "These are the activities"
              });
              tc.addChild(cp2);
  
              var cp3 = new ContentPane({
                  title: "Opportunities",
                  content: "We are known for our drinks."
              });
              tc.addChild(cp3);
  
              tc.startup();
          });
     }
  
      function destroyTabPanel() {
          require(["dijit/layout/TabContainer"], function (TabContainer) {
            var tp = dijit.byId("tabPanels");
            tp.destroyRecursive(true);
      });
  }
  </code></pre>
  
  <p>Everytime, I click a row, I m calling destroyTabPanel() first, and then I m calling getTabPanelsForTheRow().</p>