显示越来越少的javascript时出错

我有两个表，我需要显示更多和更少的功能。我已经使用javascript构建了，当我在一个表上单击ShowMore and Loss时，它工作得很好，但是当在表1和表2上同时单击ShowMore时，我需要单击show less两到三次才能返回

下面是js脚本

$(function () {

x=6;
$('#table1 li').slice(0, 6).show();
$('#showLess').hide();
$('#table2 li').slice(0, 6).show();
$('#less').hide();
$('#loadMore').on('click', function (e) {
    e.preventDefault();
    x = x+7;
    $('#table1 li').slice(0, x).slideDown();
    $('#showLess').show();
    $('#loadMore').hide();
});
$('#showLess').click(function () {
    x=(x-7<0) ? 6 : x-7;
    $('#table1 li').not(':lt('+x+')').hide();

    $('#showLess').hide();
    $('#loadMore').show();
    if(x = 6){
        $('#showLess').hide();
    }
});
$('#more').on('click', function (e) {
    e.preventDefault();
    x = x+7;
    $('#table2 li').slice(0, x).slideDown();
    $('#less').show();
    $('#more').hide();
});
$('#less').click(function () {
    x=(x-7<0) ? 6 : x-7;
    $('#table2 li').not(':lt('+x+')').hide();

    $('#less').hide();
    $('#more').show();
    if(x = 6){
        $('#less').hide();
    }
  });
});

$（函数（）{
x=6；
$（'#table1li'）.slice（0,6）.show（）；
$（'#showLess'）.hide（）；
$（'#table2 li'）.slice（0,6）.show（）；
$（'#less'）.hide（）；
$（'loadMore'）。在（'click'，函数（e）上{
e、 预防默认值（）；
x=x+7；
$（'#table1 li'）。切片（0，x）.slideDown（）；
$（'#showLess'）.show（）；
$（“#加载更多”）.hide（）；
});
$（“#无显示”）。单击（函数（）{
我找到了解决办法

我需要给另一个不同的变量名，比如a和b。这个错误是因为我只在两个条件下使用了相同的变量名
我找到了解决方案

我需要给另一个不同的变量名，比如a和b。这个错误是因为我只在两个条件下使用了相同的变量名

<style>
   #table1 li{
        display:none;
   }
   #table2 li{
     display:none;
   }
  </style>


<ul id="table1">                                                     
   <li style="text-align:left">- &nbsp; One</li>
   <li style="text-align:left">- &nbsp; Two</li>
   <li style="text-align:left">- &nbsp; Three</li>
   <li style="text-align:left">- &nbsp; Four</li>
   <li style="text-align:left">- &nbsp; Five</li>
   <li style="text-align:left">- &nbsp; Six</li>
   <li style="text-align:left">- &nbsp; Seven</li>
   <li style="text-align:left">- &nbsp; Eight</li>
   <li style="text-align:left">- &nbsp; Nine</li>
   <li style="text-align:left">- &nbsp; Ten</li>
   <li style="text-align:left">- &nbsp; Eleven</li>
   <li style="text-align:left">- &nbsp; Twelve</li>
   <li style="text-align:left">- &nbsp; Thirteen</li>
</ul>
<div id="loadMore">More</div>
<div id="showLess">Less</div>

<ul id="table2">                                                     
   <li style="text-align:left">- &nbsp; One</li>
   <li style="text-align:left">- &nbsp; Two</li>
   <li style="text-align:left">- &nbsp; Three</li>
   <li style="text-align:left">- &nbsp; Four</li>
   <li style="text-align:left">- &nbsp; Five</li>
   <li style="text-align:left">- &nbsp; Six</li>
   <li style="text-align:left">- &nbsp; Seven</li>
   <li style="text-align:left">- &nbsp; Eight</li>
   <li style="text-align:left">- &nbsp; Nine</li>
   <li style="text-align:left">- &nbsp; Ten</li>
   <li style="text-align:left">- &nbsp; Eleven</li>
   <li style="text-align:left">- &nbsp; Twelve</li>
   <li style="text-align:left">- &nbsp; Thirteen</li>
</ul>
<div id="more">More</div>
<div id="less">Less</div>