Loop append div and repeat

Posted by Diego Vieira on Stack Overflow See other posts from Stack Overflow or by Diego Vieira
Published on 2014-05-26T20:56:03Z Indexed on 2014/05/26 21:26 UTC
Read the original article Hit count: 315

Filed under:
|
|

I have this code

<div class="round-3-top">
  <div class="round-2-top">
    <div class="round-1-top"></div>
    <div class="round-1-bottom"></div>
  </div>

  <div class="round-2-bottom">
    <div class="round-1-top"></div>
    <div class="round-1-bottom"></div>
  </div>
</div>

<div class="round-3-bottom">
  <div class="round-2-top">
    <div class="round-1-top"></div>
    <div class="round-1-bottom"></div>
  </div>

  <div class="round-2-bottom">
    <div class="round-1-top"></div>
    <div class="round-1-bottom"></div>
  </div>
</div>

But i want generate dynamically, how i do that?

Ex.: i have 4 rounds, this would be the generated code

    <div class="round-4-top">
      <div class="round-3-top">
          <div class="round-2-top">
            <div class="round-1-top"></div>
            <div class="round-1-bottom"></div>
          </div>

          <div class="round-2-bottom">
            <div class="round-1-top"></div>
            <div class="round-1-bottom"></div>
          </div>
        </div>
    <div class="round-3-bottom">
      <div class="round-2-top">
        <div class="round-1-top"></div>
        <div class="round-1-bottom"></div>
      </div>

      <div class="round-2-bottom">
        <div class="round-1-top"></div>
        <div class="round-1-bottom"></div>
      </div>
    </div>
</div>

 <div class="round-4-bottom">
      <div class="round-3-top">
          <div class="round-2-top">
            <div class="round-1-top"></div>
            <div class="round-1-bottom"></div>
          </div>

          <div class="round-2-bottom">
            <div class="round-1-top"></div>
            <div class="round-1-bottom"></div>
          </div>
        </div>
    <div class="round-3-bottom">
      <div class="round-2-top">
        <div class="round-1-top"></div>
        <div class="round-1-bottom"></div>
      </div>

      <div class="round-2-bottom">
        <div class="round-1-top"></div>
        <div class="round-1-bottom"></div>
      </div>
    </div>
</div>

I try using TagBuilder in MVC C# but I can not do. What should happen is, if you are 3 rounds, adding he should go inside each div is like the example above. Any idea how can I develop it?

© Stack Overflow or respective owner

Related posts about c#

Related posts about asp.net-mvc-4