A for loop within a for loop that is split Possibly a bad question title...sorry but wasn't sure how to describe it.

Basically I have a for loop that every 4 items I want to pull in a different item from another loop. This is a series of Q&amp;A's in a staff interview, and each 4th item I want to break the side by side and pull in a full width quote.

Here is the breakdown of the code.

{% set pullQuotes =
  [
    'My biggest source of pride to date is my involvement in the Olympic Park Project: that’s part of my personal legacy.',
    'Frosts is a family environment. We’re successful from within. With our recent management acquisition of Frosts Landscapes, we’ve developed a new atmosphere, new business, and a great environment to work in. '
  ] %}

  &lt;ul class="lg:flex lg:flex-wrap lg:justify-around"&gt;
    {% for row in entry.questionsAndAnswers %}
      {#            {% set width = loop.index is divisible by(3) ? 'lg:w-full' : 'lg:w-1/2' %}#}
      &lt;li class="lg:w-1/2 py-6 px-6 max-w-xl"&gt;
        &lt;h3 class="font-black text-18 mb-3"&gt;{{ row.question }}&lt;/h3&gt;
        &lt;div class="italic mb-12"&gt;
          {{ row.answer }}
        &lt;/div&gt;
      &lt;/li&gt;

      {% if loop.index % 4 == 0 and not loop.last %}

        {% for entry in pullQuotes %}
          &lt;li class="w-full flex justify-center mb-12"&gt;
            &lt;div&gt;
              {{ svg('@icons/quote.svg', class="w-20 h-20  text-lime-500 flex-shrink-0 fill-current") }}
            &lt;/div&gt;
            &lt;blockquote class="pl-3 py-3 max-w-xl text-20 text-semibold text-lime-500 italic"&gt;
              {{ entry }}
            &lt;/blockquote&gt;
          &lt;/li&gt;
        {% endfor %}
      {% endif %}
    {% endfor %}
  &lt;/ul&gt;


The problem I have is that the loop of the pullQuotes is being iterated each time after every 4th item. What I want to do is pull the first item from the pull Quotes in position 4 and the second item from pullQuotes in position 8 and so on...

Both of these will be CMS managed and so the number of Q&amp;A's and pullQuotes could vary, so it needs to be flexible.

Anyone able to help me figure this one out?
How about this; you get the pull quote index by dividing the loop index by 4 (will always return an int) and then you modulo that index against the length of your quotes array:

{% if loop.index % 4 == 0 and not loop.last %}
      {% set entry = pullQuotes[(loop.index / 4) % (pullQuotes | length) - 1] %}
      &lt;li class="w-full flex justify-center mb-12"&gt;
        &lt;div&gt;
          {{ svg('@icons/quote.svg', class="w-20 h-20  text-lime-500 flex-shrink-0 fill-current") }}
        &lt;/div&gt;
        &lt;blockquote class="pl-3 py-3 max-w-xl text-20 text-semibold text-lime-500 italic"&gt;
          {{ entry }}
        &lt;/blockquote&gt;
      &lt;/li&gt;
{% endif %}