Jquery-mobile data-role=content clarification

What exactly is the purpose for the data-role="content"? I'm testing out a few things like animations/transitions etc and so, when I removed that from the container div that had the content, everything still worked.

For example if I do this:

<div id="secondPage" data-role="page">
    <div data-role="header">
    <h1>This is page 2 </h1>
    </div>

    <div data-role="content">
       <p>This is page 2 with some regular text here.</p>
       <p><a href="#firstPage" data-direction="reverse">Go to first page.</a></p><br/>
    </div> 
</div>

it works as it should, but if I then remove the data-role="content" part and make it for example like this:

  <div id="secondPage" data-role="page">
        <div data-role="header">
        <h1>This is page 2 </h1>
        </div>

        <div>
           <p>This is page 2 with some regular text here.</p>
           <p><a href="#firstPage" data-direction="reverse">Go to first page.</a></p><br/>
        </div> 
    </div>

it still works so I'm a bit hazy as to the need for it. So whats the point of it?