<div data-role="page" id="historyForCallerView">
    <div data-role="header" data-position="fixed" id="header">
        <h1>History for caller</h1>
        <div class="contact">
            <div class="infoContainer">
                <div class="photo"></div>
                <div class="name"></div>
                <div class="number"><span class="accountId"></span><span class="numberOfEntries"></span></div>
            </div>
            <div class="options">
                <a data-role="button" class="actionButton" id="callActionBtn" data-inline="true">Call</a>
                <a data-role="button" class="actionButton" id="smsActionBtn" data-inline="true">Message</a>
            </div>
        </div>
    </div>
    <div data-role="content" id="callerListContainer">
        <div class="selectAllBox">
            <div class="toRemove">
                <input type="checkbox" id="selectAllDetails"/>
            </div>
            <p id="selectAllText">Select all</p>
        </div>
        <div id="content">
            <ul data-role="listview" id="forCallerList"></ul>
        </div>
    </div>
    <div data-role="footer" data-position="fixed">
        <div data-role="tabbar" data-style="toolbar" id="delete-toolbar">
            <ul>
                <li id="delete">
                    <a id="deleteActionBtn">Delete</a>
                </li>
            </ul>
        </div>
    </div>
</div>
