【ejs】forの中で条件分岐をするには

前提・実現したいこと

for文を使ってコンテツを繰り返し表示し、かつ条件に応じて内容を変更したいです。
具体的には、最新のコンテンツに関しては「NEW」といったアイコンをコンテンツの中に入れたいです。
※イメージとしては、↓

本来であればjsで日時などをカウントして「NEW」を付ける付けないを分岐すると想定されますが
今回においては※イメージのように表示する事が目的です。

発生している問題・エラーメッセージ

 ERROR in ./src/ejs/index.ejs (./node_modules/html-webpack-plugin/lib/loader.js!./src/ejs/index.ejs)
    Module build failed (from ./node_modules/ejs-compiled-loader/index.js):
    SyntaxError: Unexpected token else in "."

該当のソースコード

index.ejs
1// 該当の配列のみ表示しています//
2<% var review = [
3  {text:"PIRKKA TABLE / Artek",new:"recruit.png",arrow:"serch_arrow.png"},
4  {text:"STOOL 60 / Artek",arrow:"serch_arrow.png"},
5  {text:"マッシュルームスツール S-7297 / 天童",arrow:"serch_arrow.png"},
6  {text:"ムライスツール S-5026TK-ST / 天童木",arrow:"serch_arrow.png"},
7  {text:"Bench 3人掛け / NOYES",arrow:"serch_arrow.png"},
8  {text:"Volster Sofa 3人掛け / NOYES",arrow:"serch_arrow.png"},
9  {text:"K22 SIDE TABLE / TECTA",arrow:"serch_arrow.png"},
10  {text:"MARE ROUND CLLANA / MOMO na",arrow:"serch_arrow.png"},
11  {text:"Order table DT601 / NAGANO INTERI",arrow:"serch_arrow.png"},
12  {text:"アームチュア（板座）/maruni",arrow:"serch_arrow.png"}
13] %>

_review.ejs
1<div class="p-mainReview">
2  <div class="p-mainReview__box">
3    <div class="p-mainReview__inner">
4      <div class="p-mainReview__title">
5        <div class="p-mainReview__title--text">
6          <img src="<%= img %>category.png"><p>オーナーズレビュー</p>
7        </div>
8      </div>
9      <div class="p-mainReview__content">
10        <ul class="p-mainReview__item">
11          <% for (var i = 0; i < 10; i++) { %>
12            <% if(i == 1) { %>
13              <li class="p-mainReview__item--link">
14                <a href="/"><%= review.text[i] %></a>
15                <img src="<%= img[i] %><%= review.new[i] %> ">
16                <img src="<%= img[i] %><%= review.arrow[i] %> ">
17              </li>
18            <% else { %>
19              <li class="p-mainReview__item--link">
20                <a href="/"><%= review.text[i] %></a>
21                <img src="<%= img[i] %><%= review.arrow[i] %> ">
22              </li>
23            <% } %>
24          <% } %>
25        </ul>
26      </div>
27      <div class="p-mainReview__look">
28        <img src="<%= img %>arrow.png"><a href="/">家具口コミ一覧を見る</a>
29      </div>
30    </div>
31  </div>
32</div>

試したこと

_topics.ejs
1         <% topics.forEach(function (value) { %>
2          <ul class="p-mainTopics__item">
3            <li class="p-mainTopics__item--link">
4              <img src="<%= img %><%= value.icon  %> " width="50px">
5              <div class="p-mainTopics__item--inner">
6                <a href="/" class="p-mainTopics__item--text"><%= value.text %></a>
7              </div>
8              <img src="<%= img %><%= value.new  %> " width="50px">
9              <img src="<%= img %><%= value.arrow %> ">
10            </li>
11          </ul>
12        <% }) %>

初めは上のように<%= value.new %>を指定して
連想配列の中でnewを表示する配列には　
new:"recruit.png" を記述し、それ以外の配列には newを記載しておりません。
そのため、当然ブラウザで表示すると newを記述した
コンテンツは　newのアイコンが表示され　それ以外は
※図１
このようなアイコンが繰り返されます。その為、CSS側で

_mainReview.scss
1&:nth-of-type(n + 2) {
2          display: none;
3        }

このように記述しましたが、※図１が表示されたままだったので再度考え直しました。

恐らくnewを表示させるだけの場合
newを表示のコンテンツだけはベタ書きして、それ以外はforで回す、でも表示できると思うのですが
効率的に書くには？と考えた結果、for文の中にifを使って記述した方が一回で書けると思い
現在に至ります。
しかし、うまく動かないため詳しい方、是非ご教授頂けますと助かります。