Javascript 显示更多/更少切换选项'；我不能展示一切

下面的代码由2个列表

总水果和随机水果组成，我可以将值从一个列表移动到另一个列表，反之亦然。问题是，我将
随机水果中的所有水果添加到总水果中后，单击“显示更多”按钮，无法显示完整列表

我真的不确定是什么原因导致了这个问题。任何帮助/建议都将不胜感激。谢谢


var redpill={}；
var greenpill={}；
var randompill={}；
var key=“红色水果”；
redpill[key]=“苹果”、“樱桃”、“草莓”、“石榴”、“草莓”、“西瓜”、“榴莲”、“鳄梨”、“青柠”、“蜜露”、“西瓜”、“榴莲”、“青柠”、“蜜露”、“西瓜”、“榴莲”、“鳄梨”、“青柠”、“蜜露”]；
var key2=“绿色水果”；
绿丸[key2]=“西瓜”、“榴莲”、“鳄梨”、“青柠”、“蜜露”、“西瓜”、“榴莲”、“鳄梨”、“青柠”、“蜜露”、“西瓜”、“榴莲”、“鳄梨”、“青柠”、“蜜露”]；
var key3=“随机果实”；
随机药丸[key3]=“西瓜”、“榴莲”、“鳄梨”、“酸橙”、“蜜露”、“西瓜”、“榴莲”、“鳄梨”、“酸橙”、“蜜露”、“西瓜”、“榴莲”、“鳄梨”、“酸橙”、“蜜露”、“西瓜”、“榴莲”、“蜜露”、“酸橙”、“蜜露”];
函数重画（）{
var combineString=''；
$.each（redpill[key]，函数（index）{
combineString+=（“”+redpill[key][index]+“”）；
});
$（'.combineclass'）.html（combineString）；
$.each（绿色药丸[key2]，函数（索引）{
combineString+=（''+绿色药丸[key2][index]+''）；
});
$（'.combineclass'）.html（combineString）；
var randomString=''；
$.each（随机药丸[key3]，函数（索引）{
randomString+=（''+randompill[key3][index]+''）；
});
$（'.randomclass'）.html（随机字符串）；
}
函数侦听器（）{
$（文档）.ready（函数（）{
$（文档）。在（“单击”，suggestid div），函数（）上{
data=this.innerHTML；
$（“.total\u count\u Green\u Fruits”）.html（键2+：“+greenpill[key2].length）；
var元素=$（this.detach（）；
$（'#currentid'）.prepend（''+element.html（）+''）；
});
});
$（'body'）。在（'click'，'div.new-green-fruit'，function（）上{
data2=this.innerHTML；
$（this.detach（）；
var element2=$（this.detach（）；
$（'#suggestid'）.prepend（''+element2.html（）+''）；
});
}
重画（）；
监听器（）；
var SlidehHeight=100；
$（“.container”）.each（函数（）{
var$this=$（this）；
var$wrap=$this.children（“.wrapper”）；
var defHeight=$wrap.height（）；
如果（定义高度>=滑块高度）{
var$readMore=$this.find（“.readMore”）；
$wrap.css（“高度”，滑动高度+px”）；
$readMore.append（“”）；
$readMore.children（“a”）.bind（“单击”），函数（事件）{
var curHeight=$wrap.height（）；
如果（curHeight==滑块高度）{
$wrap.animate({
高度：除雾高度
}“正常”）；
$（此）.text（“显示较少”）；
$wrap.children（“.gradient”）.fadeOut（）；
}否则{
$wrap.animate({
高度：滑块高度
}“正常”）；
$（此）.text（“显示更多”）；
$wrap.children（“.gradient”）.fadeIn（）；
}
返回false；
});
}
});
.pilldiv{
填充：8px 15px；
文本对齐：居中；
字体大小：15px；
边界半径：25px；
颜色：黑色；
保证金：2倍；
}
.以后{
内容：“\002B”；
浮动：左；
宽度：16px；
}
.新的绿色水果：之后{
内容：“\292B”；
浮动：左；
宽度：16px；
}
雷德派尔先生{
背景颜色：粉红色；
游标：默认值；
}
格林皮尔先生{
背景色：春绿；
游标：默认值；
}
.随机药丸{
背景颜色：浅蓝色；
光标：指针；
}
.类{
字体系列：开放式SAN；
}
.中心{
显示器：flex；
证明内容：中心；
}
.包装盒{
显示器：flex；
柔性包装：包装；
证明内容：中心；
}
.顶{
边际下限：20px
}
h3{
字体大小：正常；
}
.小组{
显示：表格；
身高：100%；
宽度：85%；
背景色：白色；
边框：1px纯黑；
左边距：自动；
右边距：自动；
}
.新的绿色水果{
背景颜色：浅蓝色；
光标：指针；
}
.顶{
边缘底部：30px；
}
#左面板{
浮动：左；
宽度：计算（50%-5px）；
背景色：#F2F2；
"
}
#右面板{
浮动：对；
宽度：计算（50%-5px）；
背景色：#F2F2；
"
}
.集装箱{
宽度：100%；
}
.包装纸{
位置：相对位置；
溢出：隐藏；
填充：10px；
}
.梯度{
宽度：100%；
高度：35px；
背景：url(http://spoonfedproject.com/wp-content/uploads/demo/jquer-slide/images/bg-gradient.png)重复-x；
位置：绝对位置；
底部：0；
左：0；
}
.阅读更多{
背景：#fff；
颜色：#333；
填充物：5px；
}
.多读一点{
右边填充：22px；
字号：700；
文字装饰：无；
}
.阅读更多a:悬停{
颜色：#000；
}

总果数
随机果实
我认为发生此问题的原因是，在面板上设置固定高度时，会隐藏溢出。尝试设置
溢出：在
包装器
类上滚动
，如下面的代码段所示

编辑：

当您从
wrapper


var redpill={}；
var greenpill={}；
var randompill={}；
var key=“红色水果”；
redpill[key]=“苹果”、“樱桃”、“草莓”、“石榴”、“草莓”、“西瓜”、“榴莲”、“鳄梨”、“青柠”、“蜜露”、“西瓜”、“榴莲”、“青柠”、“蜜露”、“西瓜”、“榴莲”、“鳄梨”、“青柠”、“蜜露”]；
var key2=“绿色水果”；
绿丸[key2]=“西瓜”、“榴莲”、“鳄梨”、“青柠”、“蜜露”、“西瓜”、“榴莲”、“鳄梨”、“青柠”