title: Want to add button at the bottom but with lowest index value
body: <pre><code>&lt;button class=&quot;btn&quot; onclick=&quot;func(0)&quot; value=&quot;&quot;&gt;abc&lt;/button&gt;
  &lt;button class=&quot;btn&quot; onclick=&quot;func(1)&quot; value=&quot;&quot;&gt;def&lt;/button&gt;
  &lt;button class=&quot;btn&quot; onclick=&quot;func(2)&quot; value=&quot;&quot;&gt;ghi&lt;/button&gt;
  
  &lt;script type=&quot;text/javascript&quot;&gt;
      function func(i){
          var btn= document.getElementsByClassName(&quot;btn&quot;)[i];
          console.log(btn);
          btn.style.color=&quot;red&quot;;
      }
  &lt;/script&gt;
  </code></pre>
  <p>I want to add new button every time, and want to display them on top. For adding them on top i need to change numbering till end
  any solution to this. How new button[i] can be displayed on top</p>