NaN Instead of Integer

<html>
<head>
	<script type="text/javascript">
	var x = parseInt(document.getElementById("startrow").value);
	function generateRowg() {
		x += 1; 
		var c=document.getElementById("showrowsg");
		c.innerHTML+="yaychange" + x + "<br><br>";
	}
	</script>
</head>
<body>
<input type="hidden" id="startrow" value="3">
<p><a style="color:blue" onclick="generateRowg()">Add Row</a></p>
<span id="showrowsg"></span>
</body>
</html>

I see NaN instead of a number each time. Any help?

x needs to be assigned after the page has fully loaded or more specifically the input element. Alternatively the script could moved to the very bottom just before the closing HTML tag.

Your code wouldn’t work since your trying to grab an element value that to the page doesn’t exist yet. Try the below code

var x;

window.onload = function() {
    x = parseInt(document.getElementById("startrow").value);
}

function generateRowg() {
    x += 1;
    var c=document.getElementById("showrowsg");
    c.innerHTML+="yaychange" + x + "<br><br>";
}

Thank you both. Sgt’s code works flawlessly.