title: How to separate Kendo Tabstrip tab list and content divs in html?
body: <p>So, I'm working with kendo in js. I'd like to use the tabstrip, but I'd like the tabs to be contained in a header that is styled and contains some other elements, so I am wondering if there is a way to separate the tab list and their associated divs. I'm looking to have something like this:</p>
  
  <pre><code>&lt;div class="border"&gt;
    &lt;div class="header"&gt;
      &lt;div id="tabstriplist"&gt;
        &lt;ul&gt;
          &lt;li id="tab1"&gt;First tab&lt;/li&gt;
          &lt;li id="tab2"&gt;Second tab&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;div&gt;Some other text&lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="content"&gt;
      &lt;div id="tabcontent1"&gt;Stuff&lt;/div&gt;
      &lt;div id="tabcontent2"&gt;Stuff&lt;/div&gt;        
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>However, it seems like all the example code I can find simply puts the associated divs immediately after the list, so the order of the divs corresponds to the list order. Is there any way to accomplish this sort of thing?</p>
  
  <p><strong>Edit:</strong> to clarify, I am looking for a way to display the tabcontent divs <em>outside</em> of the header. I don't really care about where the actual divs <em>are</em> in the html, but rather, where they will appear when they are generated on the page.</p>