Jquery append and html

Question

updated At the beginning, when I click button, item from function checkinforfun loop again and again. And I wish to delete the previous to prevent it only show once.

OK now, so far i have found one way to not "delete" , is to change append to html , but when I change to html all item in function checkinforfun doesn't show completely

    if (i === checkin_info.length - 1) {
        $(".checkin_progress").append(check_progress_day);
    } else {
        $(".checkin_progress").append(check_progress_day + check_progress_dot1 + check_progress_dot2 + check_progress_dot3);

    }

DEMO 1

DEMO 2

When using `html` it doesn't show completely because everytime the new data replaces the old one.. — Nibin, Jan 19 '15 at 04:28
@Outlooker but if i use back to `append` every time i clicked , item will keep adding again and again — FeelRightz, Jan 19 '15 at 04:29
When u are using html it replaces the entire content.Try putting an alert inside the if statement to really know how its working.. — Nibin, Jan 19 '15 at 04:34
@Outlooker i know how it work , if u have a solution for prevent the function only show once then will be fine — FeelRightz, Jan 19 '15 at 04:38

score 1 · Accepted Answer · edited May 23 '17 at 10:25

1

One way of doing this would be emptying the div that has a class named checkin_progress.So each time you click on the button it will clear the previous html content and your function adds the new content.

$(".checkin_progress").empty();
    $.each(checkin_info, function (i, obj) {
            //Other code;
}

Fiddle

FYI

empty()

append vs html

edited May 23 '17 at 10:25

Community

1
1

answered Jan 19 '15 at 04:41

Nibin

3,922
2
20
38

Jquery append and html

1 Answers1