Robbie Coyne Robbie Coyne - 3 months ago 9
HTML Question

How to change paragraph text in Javascript? (using values from radio buttons).(onclick event possibly not firing)

Basically, on my website I am attempting to have the option to choose between English and Spanish. How this would work is there would be two radio buttons, one for each language, and a button. When the button is pressed, the text of the paragraphs should be changed depending on the radiobutton that is checked. I have code which in my opinion should be valid but yet doesn't work.

<!DOCTYPE HTML SYSTEM>
<html>

<head>

<script type="javascript">
function ChangeLanguage()
{
try
{
if(document.Radio.rbEnglish.checked)
{
document.getElementById("p1").innerHTML = "OF COURSE!";
}
else
{
document.getElementById("p1".innerHTML = "CLARO!";
}
}
catch (err)
{
alert(err.message);
}
return false;
}

</script>

</head>

<body>

<form name="Radio">

<fieldset>

<p>

<input id="rbEnglish" name="rbLanguage" type="radio" checked="checked" value="English"/>

<label for="rbEnglish">English</label>

<input id="rbSpanish" name="rbLanguage" type="radio" value="Spanish"/>

<label for="rbSpanish">Spanish</label>

<input id="btnSubmit" type="submit" value="Submit" onclick="return ChangeLanguage();"/>

</p>

</fieldset>

</form>

<p id="p1">
OF COURSE!
</p>

</body>

</html>


After some tampering it seems to me that the "onclick" event isn't working for some reason but I can't tell why. Please help either by correcting this code or offering alternative code.

Answer

Is it because you are missing a ')'

Change this: document.getElementById("p1".innerHTML = "CLARO!";

To this: document.getElementById("p1").innerHTML = "CLARO!";

See fiddle example: https://jsfiddle.net/4urqnxze/2/