<ul id="demo">
    <li data-val="1">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-1.png" />
    </li>
    <li data-val="2">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-2.png" />
    </li>
    <li data-val="3">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-3.png" />
    </li>
    <li data-val="4">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-4.png" />
    </li>
    <li data-val="5">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-5.png" />
    </li>
    <li data-val="6">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-1.png" />
    </li>
    <li data-val="7">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-2.png" />
    </li>
    <li data-val="8">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-3.png" />
    </li>
    <li data-val="9">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-4.png" />
    </li>
    <li data-val="10">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-5.png" />
    </li>
    <li data-val="11">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-1.png" />
    </li>
    <li data-val="12">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-2.png" />
    </li>
    <li data-val="13">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-3.png" />
    </li>
    <li data-val="14">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-4.png" />
    </li>
    <li data-val="15">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-5.png" />
    </li>
    <li data-val="16">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-1.png" />
    </li>
    <li data-val="17">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-2.png" />
    </li>
    <li data-val="18">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-3.png" />
    </li>
    <li data-val="19">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-4.png" />
    </li>
    <li data-val="20">
      <img class="fruit" src="http://mobiscroll.com/content/img/fruit-5.png" />
    </li>
</ul>

<a href="#" id="clearList" class="btn btn-blue"><span class="btn-i">Clear</span></a>
<a href="#" id="show" class="btn btn-blue"><span class="btn-i">Show</span></a>

$(function(){
    $('#demo').mobiscroll().image({
        theme: 'default',
        accent: ' ',
        lang: ' ',
        display: 'modal',
        animate: ' ',
        mode: 'scroller',
        labels: ['Select Favorite Fruit'],
        height: 40,
        width: 200,
        inputClass: 'i-txt'
    });    
    $('#show').click(function(){
        $('#demo').mobiscroll('show');
        return false;
    });
    $('#clearList').click(function () {
        $('#demo' + '_dummy').val('');
        return false;
    });    
});