title: I need to sort Bootstrap grid rows by title
body: <p>I have a table that I have created in bootstrap 3 using the grid and NOT tables.</p>
  
  <p>The website is for booking busses.</p>
  
  <p>The table HTML structure looks something like this:</p>
  
  <pre><code>&lt;div class="row"&gt;
      &lt;div class="col-lg-3"&gt;&lt;h3&gt;Bus Company&lt;/h3&gt;&lt;/div&gt;
      &lt;div class="col-lg-3"&gt;&lt;h3&gt;Bus Features&lt;/h3&gt;&lt;/div&gt;
      &lt;div class="col-lg-3"&gt;&lt;h3&gt;Departure Time&lt;/h3&gt;&lt;/div&gt;
      &lt;div class="col-lg-3"&gt;&lt;h3&gt;Book Now&lt;/h3&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And then there's a loop that gets all the relevant search results...one of the iterations looks like this:</p>
  
  <pre><code>&lt;div class="row busses"&gt;
      &lt;div class="col-lg-3"&gt;&lt;p&gt;Bus Company One&lt;/p&gt;&lt;/div&gt;
      &lt;div class="col-lg-3"&gt;&lt;p&gt;Water, Toilet&lt;/p&gt;&lt;/div&gt;
      &lt;div class="col-lg-3"&gt;&lt;p&gt;6:45 pm&lt;/p&gt;&lt;/div&gt;
      &lt;div class="col-lg-3"&gt;&lt;p&gt;Book Now&lt;/p&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And that will repeat for every bus that matches the search criteria.</p>
  
  <p>I would like to be able to click on any of the titles in the first row and then that sorts the results accordingly...or maybe just departure time and bus company (column 1 and column 3).</p>
  
  <p>I have searched far and wide and ideally would just like a javascript plugin that I can use but everything I find seems to need to use an actual html <code>&lt;table&gt;</code> and I do not want to use that.</p>
  
  <p>If anyone does know of a plugin it also needs to be able to sort by time as in...see that 2pm is later than 11am if you get what I mean.</p>
  
  <p>Thanks in advance!</p>
  
  <p>Matt</p>