JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.css">
<script src="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.js"></script>
<div data-role="page" id="list">
    <div data-role="content">
        
        <ul data-role="listview">
            <li data-role="list-divider" id="a">A</li>
            <li class="showDetails">
                Adam Kinkaid
            </li>
            <li class="showDetails">Alex Wickerham</li>
            <li class="showDetails">Avery Johnson</li>
            <li data-role="list-divider" id="b">B</li>
            <li class="showDetails">Bob Cabot</li>
            <li data-role="list-divider" id="c">C</li>
            <li class="showDetails">Caleb Booth</li>
            <li class="showDetails">Christopher Adams</li>
            <li class="showDetails">Culver James</li>
            <li data-role="list-divider" id="d">D</li>
            <li class="showDetails">David Walsh</li>
            <li class="showDetails">Drake Alfred</li>
            <li data-role="list-divider" id="e">E</li>
            <li class="showDetails">Elizabeth Bacon</li>
            <li class="showDetails">Emery Parker</li>
            <li class="showDetails">Enid Voldon</li>
            <li data-role="list-divider" id="f">F</li>
            <li class="showDetails">Francis Wall</li>
            <li data-role="list-divider" id="g">G</li>
            <li class="showDetails">Graham Smith</li>
            <li class="showDetails">Greta Peete</li>
            <li data-role="list-divider" id="h">H</li>
            <li class="showDetails">Harvey Walls</li>
            <li data-role="list-divider" id="m">M</li>
            <li class="showDetails">Mike Farnsworth</li>
            <li class="showDetails">Murray Vanderbuilt</li>
            <li data-role="list-divider" id="n">N</li>
            <li class="showDetails">Nathan Williams</li>
            <li data-role="list-divider" id="p">P</li>
            <li...

CSS

#list-navigation {
    color:#696969;
    
    position:absolute;
    right:0px;
    top:0px;
    z-index:200;
}

JavaScript

$('.scrollToSelected').bind('click', function() {
    var view = $(this).attr('id');
    var list = view.split('-');
    var elem = $("#"+list[1]);
    
    // not sure if this is offset or position
    var position = elem.position(); 
    var offset   = elem.offset();
    
    //alert('left: '+position.left + ", top: " + position.top);
    //alert('left: '+offset.left + ", top: " + offset.top);
    
    $.mobile.silentScroll(position.top);
    //$.mobile.silentScroll(offset.top);
    
});

$('.showDetails').bind('click', function() {
    $.mobile.changePage( "#details", { transition: "slideup"} );
});