Tekstkleur wijzigen met Javascript?

Ik wil de kleur van een titel wijzigen wanneer er op een knop wordt geklikt.
Dit is mijn code, maar hij werkt niet en ik begrijp niet waarom niet…

<div id="about">About Snakelane</div>
<input type="image" src="https://www.blakechris.com/snakelane/assets/about.png" onclick="init()" id="btn">

en mijn js…

var about;   
function init() { 
    about = document.getElementById("about").innerHTML;
    about.style.color = 'blue';
}

Antwoord 1, autoriteit 100%

Je stelt de stijl in per element en niet op basis van de inhoud:

function init() { 
  document.getElementById("about").style.color = 'blue';
}

Met innerHTMLkrijg/stel je de inhoud van een element in. Dus als u uw titel wilt wijzigen, is innerHTMLde juiste keuze.

In jouw geval wil je echter alleen een eigenschap van het element wijzigen (verander de kleur van de tekst erin), dus adresseer je de eigenschap stylevan het element zelf.

p>

Antwoord 2, autoriteit 17%

ALLEEN gebruiken

function init() { 
    about = document.getElementById("about");
    about.style.color = 'blue';
}

.innerHTML()stelt of haalt de HTML-syntaxis die de afstammelingen van het element beschrijft., Alles wat je nodig hebt is hier een object.

Demo

Antwoord 3, autoriteit 11%

Probeer onderstaande code:

$(document).ready(function(){
$('#about').css({'background-color':'black'});    
});

http://jsfiddle.net/jpcfc/

Antwoord 4

innerHTMLis een string die de inhoud van het element vertegenwoordigt.

U wilt het element zelf wijzigen. Drop de .innerHTMLdeel.

Antwoord 5

<div id="about">About Snakelane</div>
<input type="image" src="https://www.blakechris.com/snakelane/assets/about.png" onclick="init()" id="btn">
<script>
var about;   
function init() { 
    about = document.getElementById("about");
    about.style.color = 'blue';
}