Replace contents within a div using JQuery

Question

I'm making a small grocery shopping app.

I want to make a page where the user see his/her shopping cart contents on clicking a button.

I created the template where the contents should show up in the white space. My idea is to store every item the user chooses in an array. For example:

var items = ["1 Chicken", "2 Tomatoes", "3 Spinach"]

Using this array I want to add these items line by line in the white space and then present the total amount to be paid. Kind of like a receipt. I'm not sure how to do this using JQuery.

Also, the contents of the should be empty when there's no items in the cart.

I did some research and I think I'm supposed to .html()? Though, I'm not sure about the logic behind what I want to achieve.

Here's the fiddle of the template. (The cdn links aren't working for some reason)

Could someone please help me with the logic?

vS12 · Accepted Answer · 2019-10-13 05:34:03Z

1

EDIT

function getOrder()
{
   arr  = ["1 chicken","2 orange","3 milk"]
   for(i = 0;i<3;i++)
   {
     $("#elementId").append('<p>'+arr[i]+'</p><br>')
   }
}

//blank <div> tag in your page body somewhere     
<div id="elementId">

</div>
<button onclick="getOrder()">Get Order Details</button>

edited Oct 13, 2019 at 5:34

answered Oct 13, 2019 at 4:32

vS12

3102 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Shane D'Silva Over a year ago

Is it possible not to have it in a listview? I just want it to show up as plain text line by line in the white space

vS12 Over a year ago

Yes, instead of ul, just have a div and keep appending text...

Shane D'Silva Over a year ago

How would I remove the existing with new ones when I make a new order? P.S the ul is not working. I'm using JQuery Mobile btw

Shane D'Silva Over a year ago

Could you please show me how I can do it with the element?

vS12 Over a year ago

oh, JQuery mobile ?, Let me try and get back to you.

|

Collectives™ on Stack Overflow

Replace contents within a div using JQuery

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related