title: how to create dynamic grid using javascript
body: <hr>
  
  <h2>s.no.  | description</h2>
  
  <ol>
  <li>abcd1</li>
  <li>abcd2</li>
  <li>abcd3</li>
  </ol>
  
  <p>i want to add more rows through input. now what i want is when i will add another row. let say {describtion="abcd4"}</p>
  
  <h2>then the above grid will become</h2>
  
  <h2>s.no.  | description</h2>
  
  <ol>
  <li>abcd4</li>
  <li>abcd1</li>
  <li>abcd2</li>
  <li>abcd3</li>
  </ol>
  
  <p>meaning s.no. field got updated and new row will be added at top. adding a new row on top is no issue but how could i update s.no. at same time, here i want to ask is there any specific way to do this.</p>