Вставка/Замена в HTML (Javascript)

function imya() { 
  document.getElementById("1").textContent = "Вася" 
}; 
 
function imya2() { 
  document.getElementById("1").textContent = "Петя" 
}; 
 
function familiya() { 
  document.getElementById("2").textContent = "Пупкин" 
}; 
 
function familiya2() { 
  document.getElementById("2").textContent = "Васюткин" 
}; 
 
function bally() { 
  document.getElementById("3").textContent = "5 баллов" 
}; 
 
function bally2() { 
  document.getElementById("3").textContent = "10 баллов" 
};

<button onclick="imya()">1</button> 
<button onclick="imya2()">1.2</button> 
<button onclick="familiya()">2</button> 
<button onclick="familiya2()">2.2</button> 
<button onclick="bally()">3</button> 
<button onclick="bally2()">3.2</button> 
 
<div id="variant"> 
  <span id="1"></span> <span id="2"></span> <span id="3"></span> 
</div>