I have a large piece of text (5000,10,000) inside a

tag. I want to create a function which divides this text into it's sibling

tags according the height of the device.

So basically I'm making an e-book app, so there is a div of .chapters in which theres a p tag in which i will put chapter text in. I want a function that will divide this long text into it's sibling p tags so after that i can make a slide show.

the .chapter div has overflow:scroll propert on it.

<div class="chapters with-preview current-chapter">
                    <p class="0">
                        ...all the chapter content
                    </p>
                    <p class="1">
                        ...empty sibling divs
                    </p>
                    <p class="2">
                        ...empty sibling divs
                    </p>
 </div>