添加和删​​除类元素子级

Question

I have this checkmark block. As the name says, it draws a check mark similar to the one we have here, on Stackoverflow. I want both of those elements (checkmark_stem and checkmark_kick) turn green when they're active, so I tried to do this:

window.setInterval(function () {
        $('body').find('.checkmark').each(function (index) {
            var current = $(this);
            console.log(current);
            var url = current.data('refresh');
            console.log(url);
            var child = current.children;
            var answerID = current.data('answer');
            console.log(child);
            $.get(url + '?id=' + answerID, function (data) {

                data = JSON.parse(data);

                if(data.rating.solved_date === null)
                    current.children[0].removeClass('active');
                else
                    current.children[1].addClass('active');



            });
        });
    }, 1000);

but it seems I'm not doing this correctly. Is there any way to addClass('active') to both elements?

My element html

<blockquote class="accept-answer text-right {if !$isMine} hidden{/if}" >
            <div class="checkmark" title="Accept this answer" data-url="{url('controller/api/questions/mark_as_solved')}" data-refresh="{url('controller/api/questions/refresh_accepted_answers')}" data-answer="{$answer['answerid']}" data-question="{$question['publicationid']}">
                <div class="checkmark_kick" title="Unnacept this answer"></div>
                <div class="checkmark_stem" title="Unnacept this answer"></div>
            </div>
        </blockquote>

EDIT: I had like this before and it worked. I just wanted the mark to look more like a check

<blockquote class="accept-answer text-right {if !$isMine} hidden{/if}" >
            <div class="accept" title="Accept this answer" data-url="{url('controller/api/questions/mark_as_solved')}" data-refresh="{url('controller/api/questions/refresh_accepted_answers')}" data-answer="{$answer['answerid']}" data-question="{$question['publicationid']}">
                <div class="accepted up" title="Unnacept this answer"></div>
            </div>
        </blockquote>



window.setInterval(function () {
        $('body').find('.accepted.up').each(function (index) {
            var current = $(this);
            console.log(current);
            var url = current.parent().data('refresh');
            console.log(url);
            var parent = current.parent();
            var answerID = parent.data('answer');
            console.log(answerID);
            $.get(url + '?id=' + answerID, function (data) {

                data = JSON.parse(data);

                if(data.rating.solved_date === null)
                    current.removeClass('active');
                else
                    current.addClass('active');



            });
        });
    }, 1000);

Kind regards

Answer 1

Apologies if I am not understanding your question but give this a try:

    if(data.rating.solved_date === null) {
    for (var i = 0; i < current[0].children.length; i++) {
       current[0].children[i].classList.remove("active");
    }
    } else {

    for (var i = 0; i < current[0].children.length; i++) {
        current[0].children[i].classList.add("active");
        }

}   

Answer 2

Try this - it should find all the elements under current object.

 window.setInterval(function () {
    $('body').find('.checkmark').each(function (index) {
        var current = $(this);
        console.log(current);
        var url = current.data('refresh');
        console.log(url);
        var child = current.children;
        var answerID = current.data('answer');
        console.log(child);
        $.get(url + '?id=' + answerID, function (data) {

            data = JSON.parse(data);

            if (data.rating.solved_date == null)
               current.find('div').removeClass('active')

            else
              current.find('div').addClass('active')


        });
    });
}, 1000);