I am trying to show and hide information which changes in accordance with the question it belongs to. In my code, however, no matter which question is selected, the infromation in the first question shows or respectively hides.
Any ideas how can that be fixed? 

Javascript: 

```
function displayQuestion(answer) {
    document.getElementById(answer + 'Question').style.display = "block";

    if (answer == "yes") {
        document.getElementById('noQuestion').style.display = "none";
    } else if (answer == "no") {
        document.getElementById('yesQuestion').style.display = "none"; 
    }
}

```

HTML:

```
<p>1. Would you like to improve financial structure?</p>
<label>
    <input type="radio" id="yes" name="yesOrNo" value="yes" onchange="displayQuestion(this.value)" />
    Yes, i am interested
</label>
<label>
    <input type="radio" id="no" name="yesOrNo" value="no" onchange="displayQuestion(this.value)" />
    No, hide the info
</label>
<br>
<div id="yesQuestion" style="display:none;">
    <br/>
    <p> Financial Info </p>
    <button onclick="window.location.href='fin.html'">
        Continue
    </button>
    </form>
</div>

<div id="noQuestion" style="display:none;">
    <br/>
</div>
</br>

<p>2. Would you like to improve your production? </p>
<label>
    <input type="radio" id="yes" name="yesOrNo" value="yes" onchange="displayQuestion(this.value)" />
    Yes, i am interested
</label>
<label>
    <input type="radio" id="no" name="yesOrNo" value="no" onchange="displayQuestion(this.value)" />
    No, hide the info
</label>

<div id="yesQuestion" style="display:none;">
    <br/>
    <p> Production Info </p>
    <button onclick="window.location.href='prod.html'">
        Continue
    </button>
    </form>
</div>

<div id="noQuestion" style="display:none;">
    <br/>
</div>

```

Thanks in advance!