title: How to sort an array of 9 images by the atribute "id", "name" or "alt" with javascript?
body: <p>I know how to draw the array of the 9 images in my HTML, but I don't know how to sort them by an specific attribute, I can sort them or reverse them but just directly from the input to the array. I have the 3 buttons for sorting but I'm not sure on how to do that.</p>
  
  <p>Here's the code for a button that loads the images from my files:</p>
  
  <pre><code>$('#btn1').click(function(){
    //Global
     var gallery = new Array(9);
         for(var i=1;i&lt;10;i++){ 
            gallery[i] = new Image();
            gallery[i].src = 'images/img' + i + '.png';
            }
            //setter
            $('#container1').html(gallery);
  });
  </code></pre>
  
  <p>Here's the code of my gallery, with some attributes:</p>
  
  <pre><code>&lt;div id="gallery"&gt;
     &lt;img id="img_8" alt="2" name="Name_1" class="col-md-4 img img-responsive" src="images/img8.png"&gt;
     &lt;img id="img_5" alt="4" name="Name_2" class="col-md-4 img img-responsive" src="images/img5.png"&gt;
     &lt;img id="img_7" alt="6" name="Name_3" class="col-md-4 img img-responsive" src="images/img7.png"&gt;
     &lt;img id="img_2" alt="8" name="Name_4" class="col-md-4 img img-responsive" src="images/img2.png"&gt;
     &lt;img id="img_3" alt="10" name="Name_5" class="col-md-4 img img-responsive" src="images/img3.png"&gt;
     &lt;img id="img_6" alt="12" name="Name_6" class="col-md-4 img img-responsive" src="images/img6.png"&gt;
     &lt;img id="img_9" alt="14" name="Name_7" class="col-md-4 img img-responsive" src="images/img9.png"&gt;
     &lt;img id="img_10" alt="16" name="Name_8" class="col-md-4 img img-responsive" src="images/img1.png"&gt;
     &lt;img id="img_4" alt="18" name="Name_9" class="col-md-4 img img-responsive" src="images/img4.png"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I can sort the images but just directly after the function that loads the images to the gallery with:</p>
  
  <pre><code>$('#container1').html(gallery.reverse());
  </code></pre>
  
  <p>My question is: how can I sort the images by "id" or "name".. and also showing the by the image in the HTML?</p>