Jquery /隐藏FAQ，隐藏文本

Question

我使用一些Jquery在站点上显示/隐藏问题的答案，但在文本的底部隐藏起来。我认为问题是使用Jquery代码，但我不能用它的正面或反面。请帮帮忙！

​

<script>
$(document).ready(function() {
$('.faq_question').click(function() {
if ($(this).parent().is('.open')){
$(this).closest('.faq').find('.faq_answer_container').animate({'height':'0'},500);
$(this).closest('.faq').removeClass('open');
}else{
var newHeight =$(this).closest('.faq').find('.faq_answer').height() +'px';
$(this).closest('.faq').find('.faq_answer_container').animate({'height':newHeight},500);
$(this).closest('.faq').addClass('open');
}
});
});
</script>

/*FAQS*/
.faq_question {
	margin: 0px;
	padding: 30px 0px 10px 0px;
	font-family: Century Gothic, CenturyGothic, AppleGothic, sans-serif;
	font-size: 18px;
	display: inline-block;
	cursor: pointer;
	font-weight: bold;
    color: #666666;
}
.faq_answer_container {
	height: 0px;
	overflow: hidden;
	padding: 0px;
	font-family: Century Gothic, CenturyGothic, AppleGothic, sans-serif;
	font-size: 17px;
	line-height: 1.5em;
	text-align: justify;
	color: #666666;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<h1>Why do I need Life Insurance?</h1>
<div class="faq_container">
<div class="faq">
<div class="faq_question">To Protect Your Family: &#8609;</div>
<div class="faq_answer_container">
<div class="faq_answer">
<ol>
<li><strong>Provide income:</strong> Life insurance can’t replace you, but it can replace some or all of your income if you die. It can cover the cost of funeral expenses and help pay off debts, as well as day-to-day expenses, like food, clothing, and housing. For the longer term, life insurance can help pay for college tuition or ensure retirement dreams are realized.</li>
<li><strong>Help with household needs:</strong> Think of all the work a stay-at-home parent provides. It’s invaluable, and insuring them is too. Life insurance can pay for vital household services like childcare, transportation and household chores.</li>
<li><strong>Supply benefits you can use during your lifetime:</strong> If you choose whole life insurance, the cash value in your policy, the “living benefits,” can help pay for life’s events such as buying a home, a wedding, or educational expenses. As you pay the premiums of your whole life policy, the cash value builds and you can access those funds. Some important things to keep in mind, the cash value in a whole life insurance policy is accessed through policy loans, which accrue interest at the current rate. Loans will decrease the death benefit and cash value.</li>
<li><strong>Leave a lasting legacy:</strong> Life insurance can create a financial legacy – funding the future and fueling dreams. From a favorite nonprofit to starting a scholarship program – the legacy you leave behind is all up to you.</li>
</ol>
</div>
</div>
</div>
<div class="faq">
<div class="faq_question">Replacing Your Income: &#8609;</div>
<div class="faq_answer_container">
<div class="faq_answer">Term life insurance is the most affordable way to replace your income if something happens to you. Men and women in excellent health in their mid-30’s and 40’s can buy $100,000+ of term life insurance for under a dollar a day.  You can buy term life insurance for exactly the amount of protection you need, for exactly the time you need it.  There is no greater feeling than knowing that your family will have sufficient income if something were to happen to you. Make sure that your family is taken care of, and get a <a href="get-personalized-quote.html">free quote</a> today.</div>
</div>
</div>
</div> 
</div>

​

Answer 1

在.faq_answer div中的list元素上有一个页边距、顶部和底部，not没有考虑到这一点。

添加这个样式可以解决这个问题。

.faq_answer ol { margin: 0px; }