在nunjucks模板中折叠问题

Question

我在Nunjucks模板中使用了折叠。首先，我想在点击more时显示100个字符，它应该展开（连续显示总文本）但是当我点击更多时，文本从新行而不是同一行开始。

<p class="meta-info-decription" {{wikipedia.wiki_url}}>
    <span>
        {% if(wikipedia.wiki_extract.length > 100 ) %}
            {{ wikipedia.wiki_extract.slice(0,100) }}
            <span class="read-more more clickable"
                  data-toggle="collapse"
                  id="more-wiki-data"
                  data-target="#wiki-text">...more
            </span>
            <span id="wiki-text" class="collapse">
                {{ wikipedia.wiki_extract.slice(100)}}
                <span class="read-more less"
                      data-toggle="collapse"
                      id="more-wiki-data"
                      data-target="#wiki-text">less ...
                </span>
            </span>

        {% else %}
            {{ wikipedia.wiki_extract }}
        {% endif %}
    </span>
    <a href="{{ wikipedia.wiki_url }}" target="_blank">
        Wikipedia
    </a>
</p>

点击更多：

Before click on more

点击更多：

After click on more