Multiple 'read more' links on one page

JavaScript
1

I’d like to implement Viral Patel’s cool dynamic read more links to a page I’m working on. I’d like to add another level so that I could embed some of these links into another div…See demo here

Can I add this to the java or would it be better to create another script using a different div id?

2

Unfortunately the example page is returning a 404

3

Apologies link fixed…

I’d also like to allow h and p tags inside the comment div if possible?

4

The link in your first post points to http://jsfiddle.net/valleysboy/P7Jtz/ and this is still returning a 404

5

Sorry Pullo only chaged the quoted link its - http://jsfiddle.net/valleysboy/jvCSe/ (i’ll wake up)

6

Hi there,

So the demo’s working now.
I can see three divs which display extra content when I click on the more link.

But what is it exactly that you are trying to do. I didn’t quite get it. Could you elaborate a little.

7

Pullo,

I’d like to have the same <div class=“comment more”> that could have the 3 divs inside of it - essentially another level up? (hope this makes sense).

8

You’d like to have three <div class=“comment more”> inside a <div class=“comment more”>.
Something like:

<div class="comment more">
  Some random text
  <div class="comment more">Some more random text</div>
  <div class="comment more">Some more random text</div>
  <div class="comment more">Some more random text</div>
</div>

Is that what you mean?

9

Apologies I should have added the html - Yes that is exactly what I’d like - also I cant seem to add any html elements inside the div’s like <p> <img> tags - it stops the jqery from working, I’d like to fix this also if possible???

10

This works just fine for me. Here’s a fiddle to demonstrate: http://jsfiddle.net/openFiddle/9bDJ6/5/

The other problem is a little trickier.
You’re trying to toggle divs within a div which is toggleable and this cannot work with your current code.

If I was you, I would use the show-hide plugin instead. Its homepage is here: http://papermashup.com/demos/jquery-show-hide-plugin/
I’ve also made you a small demo here demonstrating nested content: http://hibbard.eu/blog/pages/show-hide-plugin-demo.html
It is entirely configurable. If you don’t like the animation effect, you can disable that.

HTH

11

GENIUS - code is really well explained - thanks so much Pullo very appriciated!