JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<div class="col-xs-8 tabs">
    <input type="radio" name="inset" value="" id="tab_1" checked="">
    <label id="tab_1" class="label-testo pull-left" for="tab_1">кнопка 1</label>
    <input type="radio" name="inset" value="" id="tab_2">
    <label id="tab_2" class="label-testo pull-left" for="tab_2">кнопка 2</label>
    <table>
            <tbody>
            <tr>
            <td>
            <ul><li class="var">1</li><li class="var">2</li></ul>               
      </td>
            </tr>
            </tbody>
          </table>
    </div>
    <div class="col-xs-8 tabs">
    <input type="radio" name="inset" value="" id="tab_1" checked="">
    <label id="tab_1" class="label-testo pull-left" for="tab_1">кнопка 1</label>
    <input type="radio" name="inset" value="" id="tab_2">
    <label id="tab_2" class="label-testo pull-left" for="tab_2">кнопка 2</label>
    <table class="variations" style="max-width:150%; width:150%;" cellspacing="0">
            <tbody>
            <tr>
            <td class="value woo-variation-items-wrapper">
            <ul><li class="var">1</li><li class="var">2</li></ul>               
      </td>
            </tr>
            </tbody>
          </table>
    </div>

CSS

.tabs>input:checked + label {
        color: #444;
    background: #eee;
}

JavaScript

jQuery(document).ready(function( $ ){
   $('li.variable-item:nth-child(2n)').hide();
 $('#tab_1').click(function(){
   $(this).closest("div.tabs").find("li.var:nth-child(2n)").hide();
   $(this).closest("div.tabs").find("li.var:nth-child(2n+1)").show();
    });
    
    $('#tab_2').click(function(){
      $(this).closest("div.tabs").find("li.var:nth-child(2n)").show();
   $(this).closest("div.tabs").find("li.var:nth-child(2n+1)").hide();
    }); 
});