Sorting on div elements inside same column

collincouch

I have a data table with one column. Inside that column I have div elements that I use to represent the columns from a UI perspective.

<table class="table" id="tableSearchResults">
                                        <thead>
                                            <tr>
                                                <th>Column 1</th>
                                            </tr>
                                        </thead>
                                        <tbody>

                                                <tr>
                                                    <td>
                                                        <div class="portlet light bordered">
                                                            <div class="portlet-body">
                                                                <div class="row">
                                                                    <div class="col-md-11 col-xs-10">
                                                                        <div class="row">
                                                                            <div class="col-md-4 col-xs-12">
                                                                                <span class="bold">Yoga Instructor</span>
                                                                            </div>
                                                                            <div class="fa-item col-md-2 col-xs-6">
                                                                                <i class="fa fa-map-pin"></i>12 mi
                                                                            </div>

                                                                            <div class="fa-item col-md-2 col-xs-6">
                                                                                <i class="fa fa-building-o"></i>L.A. Fitness
                                                                            </div>
                                                                            <div class="fa-item col-md-2 col-xs-6">
                                                                                <i class="fa fa-calendar"></i>Jan. 16
                                                                            </div>
                                                                            <div class="fa-item col-md-2 col-xs-6">
                                                                                <i class="fa fa-user"></i>Jane Doe
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="fa-item col-md-1 col-xs-2">
                                                                        <i class="fa fa-chevron-right"></i>
                                                                    </div>
                                                                </div>

                                                            </div>
                                                        </div>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        <div class="portlet light bordered">
                                                            <div class="portlet-body">
                                                                <div class="row">
                                                                    <div class="col-md-11 col-xs-10">
                                                                        <div class="row">
                                                                            <div class="col-md-4 col-xs-12">
                                                                                <span class="bold">Zumba Instructor</span>
                                                                            </div>
                                                                            <div class="fa-item col-md-2 col-xs-6">
                                                                                <i class="fa fa-map-pin"></i>25 mi
                                                                            </div>

                                                                            <div class="fa-item col-md-2 col-xs-6">
                                                                                <i class="fa fa-building-o"></i>Anytime Fitness
                                                                            </div>
                                                                            <div class="fa-item col-md-2 col-xs-6">
                                                                                <i class="fa fa-calendar"></i>Nov. 28
                                                                            </div>
                                                                            <div class="fa-item col-md-2 col-xs-6">
                                                                                <i class="fa fa-user"></i>John Henry
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="fa-item col-md-1 col-xs-2">
                                                                        <i class="fa fa-chevron-right"></i>
                                                                    </div>
                                                                </div>

                                                            </div>
                                                        </div>
                                                    </td>
                                                </tr>
                                        </tbody>
                                    </table>

I still need to be able to sort on the columns I've specified in the div elements but I don't know if that's possible since I'm not using td tags. Any suggesstions?