Question

I have one form which is submitting by ajax.

I am running on php.

After the entry completed by ajax, that entry should be updated to my html.
For example

My HTML Code

<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
</ul>

Now when any one insert new entry with 5, then my html should be updated with below HTML.

<ul>
     <li>1</li>
     <li>2</li>
     <li>3</li>
     <li>4</li>
     <li>5</li>
</ul>

Thanks in advance.

Avinash

Answer 1

I have done it my own.

Please check the below code for the answer.

// Select UL to append    
var commentUL = $('comment_ul');

//Create new li to insert
    var commentnewLI = new Element('li', {id: 'myFirstElement'});
// Append text to li
    commentnewLI.appendText(responseValueArray[1]);
// Insert li into UL
    commentUL.adopt(commentnewLI);

Mootools’ admopt method has works for me.

But i have some problem regarding this.

My response has some HTML in the to append in the LI.
Like below

Dummy text, Dummy text,Dummy text,<br/><span>User Name</span>

Can u please suggest that whats the problem over here.

Thanks
Avinash