Hello, I need a little help finishing off a JQuery function, which will show or hide list items when you click on a link.
I'm almost there, but it's messed up on page load, and not sure how to modify the function.
-- On page load, it is showing the full list, and both links See more/See Less features.
-- When you click the See all features link, it shows the full list, and hides the show all features link. So this is working.
-- When you click the See less features, it hides the extra list items, and the show less features link. So this is working.
So, just have to figure out the on page load part to get this working.
<div class="checks">
<ul>
<li>Scheduling</li>
<li>Daily Logs</li>
<li>To-Do's</li>
<li>Messaging</li>
<li>Client Portal</li>
<li class="hidinglist">Photos, Videos and Documents</li>
<li class="hidinglist">Time Clock</li>
<li class="hidinglist">Load Management</li>
<li class="hidinglist">Proposals</li>
<li class="hidinglist">Comments</li>
<li class="hidinglist">Owner Invoices</li>
<li class="hidinglist">Estimating</li>
<li class="hidinglist">Budget</li>
<li class="hidinglist">Custom Branding</li>
<li class="hidinglist">Sub Portal</li>
<li class="hidinglist">QuickBooks Integration</li>
<li class="na hidinglist">Selections</li>
<li class="na hidinglist">Bills and Purchase Orders</li>
<li class="na hidinglist">RFIs</li>
<li class="na">Warranties</li>
<li class="na">Surveys</li>
<li class="na">Bids</li>
<li class="na">Change Orders</li>
</ul>
</div>
<p id="all-features-core" class="see-all-features">See all features</p>
<p id="less-features-core" class="see-all-features">See less features</p>
Select all Open in new window
jQuery(document).ready(function( $ ) {
$('#all-features-core').click(function(){
$('#all-features-core').css('display','none');
$('.hidinglist').css('display','block');
$('#less-features-core').css('display','block');
});
$('#less-features-core').click(function(){
$('#less-features-core').css('display','none');
$('.hidinglist').css('display','none');
$('#all-features-core').css('display','block');
});
});
Select all Open in new window
One quick question on this, I have it all working, but when i click the link, the see less features appears, but inline. how can i change it to block?
Open in new window