Inhalt eines div-Tags zeigen- und verdecken lassen (JQuery)

[WebNewBie]

Ich möchte den Inhalt eines div-Containers mithilfe von JQuery zeigen- und verdecken lassen.
Aus irgendeinem Grund funktioniert mein Code nicht wie ich genau wollte.
Die Funktion, die ich geschrieben hab', führt den Code in der if-Aussage, aber nicht den in der else-if Block.
Woran scheitert meine Funktion? Was mache ich da falsch?


HTML:

<div class="modal-body">
    <button class="forward">Next</button>
    <br>
    <p id="text1">First text comes here...</p>
    <p id="text2">Second text comes here...</p>
    <p id="text3">Third text comes here...</p>
</div>

JQuery:

$('#text2').hide();
$('#text3').hide();

$('.forward').on('click', function () {
    if(('#text1').length) {
    $('#text1').hide();
    $('#text2').show();
}
else if(('#text2').length) {
    $('#text2').hide();
    $('#text3').show();
}
});

 

[mrBrown]

Deine Bedingung ist das Problem: ('#text1').length, "#text1" ist ein String, die Länge von "#text1" ist offensichtlich 6 und damit ist der gesamte Ausdruck "wahr".