Selecting parents jquerymobile

Boilerplate to test jquerymobile code 1.3.2

by Varun Nath

HTML

<div data-role="page" id="homepage">
   
    <div data-role="header" class="header">
        <h1>Header</h1>
        
        <a href="#" class="verify">Verify</a>
    </div>
    
    <div data-role="content">
        <ul data-role="listview">
            <li><a href="#">Hello</a><a href="#verify"></a></li>
            
            <li><a href="#">Hello</a><a href="#verify"></a></li>
           
        </ul>
    </div>
    
    <div data-role="footer">
        
    </div>
    
</div>

CSS

.hide
{
    display:none;
}

JavaScript

$('a.verify').hide();
  
$(document).on('click','a[href="#verify"]',function(e){
    
    
    console.log($('a.ui-btn.verify').css('display'));
    
    if($('a.verify').css('display') == 'none'){
        console.log('show');
        $('a.verify').show();
    }
    else
    {
        console.log('hide');
        $('a.verify').hide();
    }
           
  
        
    
    e.preventDefault();
        
    console.log($(this).parents('div[data-role="page"]').find('.header h1').text('Dynamic Header'));
                    
    
    
});