How to get the maximum id of DOM element with unordered pattern

I have an unordered list of form elements with ids

 <ul class="sortable" id="userForm">
<li style="visibility: hidden;" class="ui-state-default">Test</li>
<li style="display: list-item;" class="ui-state-default">
<div class="control">
  <label class="">Label Here</label>
  <textarea readonly="readonly" id="4"></textarea>
  <div class="delete" style="display: inline;"><sup>x</sup></div>
  <div class="properties txtarea" style="display: inline;">Properties</div>
</div>
</li>
<li style="display: list-item;" class="ui-state-default ">
<div class="control">
  <label class="">Label Here</label>
  <input readonly="readonly" id="3" name="txt" value="" type="text">
  <div class="delete" style="display: inline;"><sup>x</sup></div>
  <div class="properties txtbox" style="display: inline;">Properties</div>
</div>
  </li>
  <li style="display: list-item;" class="ui-state-default">
<div class="control">
  <label>&nbsp;</label>
  <input id="2" type="radio">
  <span class="controlText">Ra开发者_JS百科dio Button</span>
  <div class="delete" style="display: inline;"><sup>x</sup></div>
  <div class="properties radio" style="display: inline;">Properties</div>
</div>
 </li>
<li style="display: list-item;" class="ui-state-default">
<div class="control">
  <label>&nbsp;</label>
  <input id="1" type="checkbox">
  <span class="controlText">Check Box</span>
  <div class="delete" style="display: inline;"><sup>x</sup></div>
  <div class="properties chkbox" style="display: inline;">Properties</div>
</div>
</li>
</ul>

How can i get the Maximum id from these elements. The Ids are not in a particular order but the element classes and format is same.

Something like this could work

var max = 0;
$('.control').each(function(i,n){
 // var check = $(n).children('input').attr('id')/*.prop() if jquery 1.6*/
  var check = $(n).children('.the_id').attr('id')/*.prop() if jquery 1.6*/
  if(check>max) max = check;
});

Here is a jsfidle version

try the following code:

var maxId = 0;
$(".sortable *[id]").each(function() {
    if(maxId < $(this).attr("id")){ maxId = $(this).attr("id")}
});

alert("max id value is: "+maxId);

Demo: http://jsfiddle.net/5UZTD/

building on Val's answer

var max = 0;
$('.control *[id]').each(function(i,n){
  var check = $(n).attr('id')/*.prop() if jquery 1.6*/
  if(check>max) max = check;
});

the selector finds any element with an id attribute.