CSS tabs HTML structure

tabs.html

<!-- main wrapper -->
<div class="tabs">
  <!-- radio block will be hidden, but will be used to control the tabs -->
  <input class="tabs__radio" id="myTab1" type="radio" name="myTabs" value="1">
  <input class="tabs__radio" id="myTab2" type="radio" name="myTabs" value="2">
  <input class="tabs__radio" id="myTab3" type="radio" name="myTabs" value="3">
  ...
  <input class="tabs__radio" id="myTab10" type="radio" name="myTabs" value="10">
  
  <!-- labels will be display as actual tabs -->
  <label class="tabs__label" for="myTab1">Tab 1</label>
  <label class="tabs__label" for="myTab2">Tab 2</label>
  <label class="tabs__label" for="myTab3">Tab 3</label>
  ...
  <label class="tabs__label" for="myTab10">Tab 10</label>
  
  <!-- wrappers for tab's content -->
  <div class="tabs__content">1. tab content...</div>
  <div class="tabs__content">2. tab content...</div>
  <div class="tabs__content">3. tab content...</div>
  ...
  <div class="tabs__content">10. tab content...</div>
</div>