How do I save the innerHTML to a Javascript Variable so that is stays the same when I change the actual innerHTML

user_15310154 0
Viewed 274

So I'm working on a website that has buzzfeed-like quizzes in it (where the result is calculated based on how many times the user answered with a specific answer) The way I've decided to handle tied results is to display all the results that were tied in a neat row of buttons that the user can click on to view more details for that result in the same psge. clicking one of those buttons erases the buttons, so i've implemented a "back" button to show the buttons again, all of them having the same functionality. my javascript looks like this:

var container = document.getElementById("container");
const og = container.innerHTML;
...
function backButton() {
    document.getElementById("back").onclick = function() {
        container.innerHTML = og;
    };
}

the backbutton(); function is called to implement the button whenever one of the other buttons are pressed. with og being a const i've managed to get the back button to revert the page back to it's original state but then the buttons lose all functionality Please help me

dom-events dom html javascript
1 Answers

Use a data attribute on the element itself

var container = document.getElementById("container");
container.data.og = containter.innerHTML;

...
function backButton() {
    document.getElementById("back").onclick = function() {
        container.innerHTML = container.data.og;
    };
}
user_46650
Related