Is this a good way to insert content from object to the DOM?

JavaScript
1

Hi I would like to know if this could be a good way to pass info from objects called; firstPerson and secondPerson to the DOM after I click my buttons so I can get different info for the first and second person depending on which button I click. THANKS
HTML

   <div id="mainDiv">
        <p>Hello my name is <span id="nameInfo"></span></p>
        <p>My home country is <span id="countryInfo"></span></p>
        <p>My favorite food is <span id="foodInfo"></span></p>
        <p>Currently I live in  <span id="currentInfo"></span></p> 
    </div>
    <button id="btnOne" onclick="firstPersonFunction()">Info first person</button>
    <button id="btnTwo" onclick="secondPersonFunction()">Info second person</button>

CSS

#mainDiv {
    background-color: darkorange;
    width: 300px;
    height: 200px;
    margin: 20px;
    padding: 15px;
}
#mainDiv p {
    color: #000;
    font-size: 20px;;
}

JS

function firstPersonFunction() {
  var firstPerson = {
    name: "John",
    homeCountry: "USA",
    favFood: "pizza",
    currentPlace: "Las Vegas"
  }
  document.getElementById("nameInfo").innerHTML = firstPerson.name;
  document.getElementById("countryInfo").innerHTML = firstPerson.homeCountry;
  document.getElementById("foodInfo").innerHTML = firstPerson.favFood;
  document.getElementById("currentInfo").innerHTML = firstPerson.currentPlace;
};
function secondPersonFunction() {
  var secondPerson = {
    name: "Chris",
    homeCountry: "Canada",
    favFood: "burgers",
    currentPlace: "Toronto"
  };
  document.getElementById("nameInfo").innerHTML = secondPerson.name;
  document.getElementById("countryInfo").innerHTML = secondPerson.homeCountry;
  document.getElementById("foodInfo").innerHTML = secondPerson.favFood;
  document.getElementById("currentInfo").innerHTML = secondPerson.currentPlace;
};

CODE PEN

2

It’s how I’d do it :slight_smile: Interested to see what others say.

4

Thanks alot guys, happy to see that this code wasn’t extremely bad, thanks for the help

6

Yup I was thinking to put more buttons so this is the perfect solution for this problem, thanks alot