I want two buttons to appear right after one of the two buttons prior is pressed.
var a = "Jeg heter ";
var b = "Benjamin";
var j = "Jasmin";
function endre() {
var x = document.getElementById("endre1");
if (x.innerHTML == "Velg navn" || j) {
x.innerHTML = a + b;
}
}
function endre2() {
var x = document.getElementById("endre1");
if (x.innerHTML == "Velg navn" || b) {
x.innerHTML = a + j;
}
}<button onclick="endre2()">Jasmin</button>
<button onclick="endre()">Benjamin</button>
<div id="endre1">Velg navn</div>
<br>
<button class="visknapp24()" style="display: none;">24 år</button>
<button class="visknapp20()" style="display: none;">20 år</button>Any way to add to this?
Firstly you need the same function to show for both the buttons. Also, you have to just query the buttons using either querySelector() or getElementsByClassName().
Once you have that you can use style property from JS to modify CSS styles:
var a = "Jeg heter ";
var b = "Benjamin";
var j = "Jasmin";
function endre() {
var x = document.querySelector(".visknapp24");
var y = document.querySelector(".visknapp20");
x.style.display = 'block';
y.style.display = 'block';
}<button onclick="endre()">Jasmin</button>
<button onclick="endre()">Benjamin</button>
<div id="endre1">Velg navn</div>
<br>
<button class="visknapp24" style="display: none;">24 år</button>
<button class="visknapp20" style="display: none;">20 år</button>You would add an id to your buttons, then update the style.
<button id='btn1' class="visknapp20()" style="display: none;">20 år</button>
function endre() {
var x = document.getElementById("endre1");
if (x.innerHTML == "Velg navn" || j) {
x.innerHTML = a + b;
document.getElementById("btn1").style.display='inline'
}
}
It might be better to use the visibility style verses the display style.