Javascript/Show More Content


Hello Kevin. This is my code. I have a few problems.

1. How would I implement a sliding effect on the click of the link?
2. I would like to be able to add div's to this code so that I could add a text indent to each paragraph, but every time I try to put a div inside of the .main>div, the script breaks

Thank you!

Hi Cody,

Thank you for your question.

1. I'm not 100% clear on what you want to "slide". If you want the text that appears after the first 250 characters to "Slide down / slide up" instead of just showing / hiding, then you will need to put each chunk of text in its own container (i.e. a DIV or a SPAN, etc...) and then use the jQuery slideUp() / slideDown() methods:

2. To add a DIV to the inside of the div.main > div, just use jQuery's append() or prepend() methods, which I have done at the end of your JS code (I made the text red so that it is easier to see. Use Firebug to inspect and see their place in the DOM).

Here is a link to your code with some JS added at the end, which appends / prepends some red text:

Best Wishes,



All Answers

Ask Experts


Kevin Chisholm


I can answer questions about: JavaScript, Object-Oriented JavaScipt, JSON, AJAX, jQuery, HTML, CSS


I am a Front-End Web Developer living in New York City. I have provided services to titles such as,,,,,, and Being particularly passionate about Object-Oriented JavaScript as well as Web Standards, I spend a fair amount of time writing about / teaching Front-End Web Development techniques. In my free time I enjoy reading about advanced JavaScript, as well as Web Development trends and best practices. My Blog is: JavaScript-specific blog posts can be found here:

NYC Front-end Developers CSS3 / HTML5 The future of front end Front-End Engineers Javascript Syracuse University Alumni Network

Syracuse University - VPA - 1983 - 1987

Past/Present Clients

©2017 All rights reserved.