CODEWITHSUNDEEP
javascripthtml
KewreRDG
KewreRDG

Reputation: 13

Reset data from document getElementById

I can't reset an element in my code. I have a code that allows me to create spans with each click. However, each click creates additional spans without overwriting the previous ones. I would like this one not to keep the previous spans in value.

This my code :

  const fieldText = document.getElementById('fieldDashboardText');

    if(info.title != undefined){
        isFields = true;
        isFirst = true;
        const title = info.title;

        fieldText.innerHTML = fieldText.innerHTML + '<a class="fiedsInVerbatimDashboard"> Title : </a>' + '<br>';
        let newTitle = title.replace(/[,.:;!?()"]+/g, '');
        newTitle = newTitle.replace(/[']+/g, ' ');
        const features = newTitle.split(' ');

        const positiveValues = app.generateLimeOpacity(positive, 'positive');
        const negativeValues = app.generateLimeOpacity(negative, 'negative');
        const newDataLime = [...positiveValues, ...negativeValues];
        var spanCounter = 0;

        console.log("Features in tile  : ", features);
        for (let i = 0; i < features.length; i++) {
            for (let j = 0; j < newDataLime.length; j++) {
                if (features[i] === newDataLime[j].label) {
                    spanCounter ++ 
                    // Max 12 span by each line for ver
                    if(spanCounter == 12){
                        spanCounter = 0;
                    }
                        features[i] =  `<span class="verbatim-dashboard__text__lime hide" style="background-color: ${newDataLime[j].rgba};">${features[i]}</span>`;
                    }
                }
            } 
            fieldText.innerHTML = fieldText.innerHTML + features.join(" ");
            fieldText.innerHTML = fieldText.innerHTML + '<br>';
        }

I would like every click to have the fieldText constant "empty" like the first call of some sort. I hope I have been clear enough. Thank you in advance!

Upvotes: 0

Views: 174

Answers (2)

Marvin Fischer
Marvin Fischer

Reputation: 2572

Change 

fieldText.innerHTML = fieldText.innerHTML + features.join(" ");

to 

fieldText.innerHTML = features.join(" ");

Upvotes: 1

Maheer Ali
Maheer Ali

Reputation: 36574

You are adding features to previous innerHTML. You set innerHTML to features not concat with existing innerHTML.

fieldText.innerHTML = features.join(" ") + '<br>';

Upvotes: 0

Related Questions