Problem med innerHTML

Jag skulle vilja lägga till lite ellement dynamiskt på sidan på följande vis:

function startbuttonfunction() 
{ 
var pointsection=document.getElementById("elm1"); 
elm1.innerHTML+="<h1> Apan"; 
elm1.innerHTML+="har en banan"; 
elm1.innerHTML+="</h1>"; 

}

Resultatet blir tyvärr:

<h1> Apan <h1> har en banan

istället för som jag har tänkt mig ..

<h1> Apan har en banan <h1>

Hur borde man göra istället för att kunna bygga ellementen på ett dynaminskt vis?

Du får nog pussla ihop koden i en variabel först:

var content = "<h1>Apan";
content += " har en banan";
content += "</h1>";
document.getElementById("elm1").innerHTML = content;

Ett tips, när det handlar om sådana här små koder så slå ihop allt. det skulle jag i alla fall göra.

function startbuttonfunction()
{
document.getElementById("elm1").innerHTML = "<h1>Text...</h1>";
}

För att sedan förbättra funktionen ännu mer så skulle jag gjort såhär:

function set(x,y)
{
	if(!document.getElementById(x) || !y)
		return false;
	document.getElementById(x).innerHTML = y;
	return true;
}

Nu kan du använda denna funktionen att ändra värdet på flera ställen enkelt via att anropa funktion såhär:

if(set("mindiv","denna text kommer kommer nu finnas i mindiv"))
    alert("Ändringen lyckades...");
if(!set("divsomintefinns","denna text kommer aldrig att skrivas"))
    alert("Ändringen misslyckades...");

Bara ett tips :)

...

Jag stoppar in en siffra i en tabell med innerHTML. Nu skulle jag vilja addera fler tal till siffran. Hur kan man få ut siffran ur tabellen för vidare processande? Det ser alltså ut på följande vis:

<table>
<tr><td> 100 </td></tr>
</table>

tal = parseInt(td.innerHTML, 10);
tal += 50;
td.innerHTML = tal;

...

Tack så mycket du hjälpte mig verkligen.