Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to add paragraph on top of div content

How can I add multiple paragraph tag, newly tag on top within div container.

<div id="pcontainer">   <p>recently added on top every time on click event recently added paragarph on top</p>   <p>added before recent</p> </div> 

I am using append but every time I click button it add to bottom I need it to added on top of all paragraph please help.

like image 392
Yasir Avatar asked Apr 09 '09 12:04

Yasir


People also ask

How do I put text on top of a div?

Position the div relatively ( position: relative; ), and then the text absolutely ( position:absolute; ). Make sure the text is inside an element inside the div, and then set the nested element's top position to a negative number until it is positioned to your liking.

How do I write over a div?

For that you can use position: absolute; for the overlapping div . And add any text to that div. You can use class or id to style them! In your image, you are using position: absolute; for image tag too.


1 Answers

You may use prepend to add the paragraph at the top of the container:

// HTML: <div><p>Lorem ipsum</p></div> $('div').prepend('<p>Bla bla bla'); 

Update: Regarding your comment about how to fade in the paragraph - use fadeIn:

$("#pcontainer").prepend($('<p>This paragraph was added by jQuery.</p>').fadeIn('slow')); 

A working demo: http://jsbin.com/uneso

like image 165
moff Avatar answered Sep 18 '22 17:09

moff