Bhupender Bhupender - 6 months ago 12
HTML Question

Combining two or more paragraphs

I am trying out a simple 'point the error in a sentence quiz'. The code seems to work all fine but I would like the three parts of a sentence to appear as in a paragraph.

<p onclick="myFunction()">Being a holiday</p>
<p onclick="myFunction2()"> we decided to go for a picnic</p>
<p onclick="myFunction3()"> to the nearby park.</p>

<p id="demo"></p>

<script>
function myFunction() {
document.getElementById("demo").innerHTML = "<img src='../images/right.jpg'>";
}
function myFunction2() {
document.getElementById("demo").innerHTML = "<img src='../images/wrong.jpg'>";
}
function myFunction3() {
document.getElementById("demo").innerHTML = "<img src='../images/wrong.jpg'>";
}
</script>

Answer

You can put each sentence piece in individual <span> tags instead of <p> tags, and then set the onclick attribute on those <span> tags. Then just put all those in a single <p> tag:

<p>
  <span onclick="myFunction()">Being a holiday</span>
  <span onclick="myFunction2()"> we decided to go for a picnic</span>
  <span onclick="myFunction3()"> to the nearby park.</span>
</p>

Check out this working fiddle: https://jsfiddle.net/tp0yrwk8/1/

Comments