Question

I will try my best to explain what I wish to do and do correct me or question me if I did not get my question across correctly.

I have a jquery function as follows:

function processResult(xData, status) {
    $(xData.responseXML).find("z\\:row").each(function() {
        var liHtml = "<a href=" + $(this).attr("ows_Title") + "><img src=" + $(this).attr("ows_snapshot_file_location") + " width=120 height=90><strong>" + $(this).attr("ows_video_description") + "</strong><br /><br />" + $(this).attr("ows_video_description") + "<em>" + $(this).attr("ows_video_length") + "</em></a><br />";
        $("#videoplaylist").append(liHtml);
    });
}

I have a HTML code as follows:

<div id="playlist">

/*** Something to be derive from #videoplaylist ***/

</div>

Actually, I can just call the jquery function as follows:

<div id="videoplaylist"> </div>

inside the

/*** Something to be derive from #videoplaylist ***/

but what I actually want was that the code to reflect all the "lihtml" variable.

If the "lihtml" variable contain

 <em>Hello World</em>

it will display "Hello World" in the "/*** Something to be derive from #videoplaylist ***/" and not

 <em>Hello World</em>

Appreciate any insight.

Answer 1

I will try to interpret this as best I can.

My interpretation:

You have the following in your code

<div id="videoplaylist">/* Something to be derive from #videoplaylist */</div>

and then you have a block of html (<b>Something</b>) that you would like to insert there like this

<div id="videoplaylist"><b>Something</b></div>

but you are getting

<div id="videoplaylist">/* Something to be derive from #videoplaylist */<b>Something</b></div>

Is that correct?

If so simply replace

$("#videoplaylist").append(liHtml);

with

$("#videoplaylist").html(liHtml);

The append command will only add the html to the end of the inside content. The html command will replace the complete content.

HTH
Alex