Insert element between elements via using date (by date)

Insert element between elements via using date (by date)

I wonder how to insert a element via using date ?
Example :
<time datetime="2013-07-29">2013-07-29</time>
<time datetime="2013-06-14">2013-06-14</time>
<time datetime="2013-06-10">2013-06-10</time>
<time datetime="2013-05-01">2013-05-01</time>
so new element look like... :
<time datetime="2013-06-12">2013-06-12</time>
How to insert this new element between 2013-06-14 and 2013-06-10elements
functionally ?
This is my code :
HTML :
<input value ="2013-06-12"><button>Add</button>
<time datetime="2013-07-29">2013-07-29</time>
<time datetime="2013-06-14">2013-06-14</time>
<time datetime="2013-06-10">2013-06-10</time>
<time datetime="2013-05-01">2013-05-01</time>
jQuery :
$('button').on('click',function(){
var date = $('input').val();
var html = $('<time datetime="'+date+'">'+date+'</time>');
//html.addClass('new').insertAfter('time[datetime="2013-06-14"]');
});
Demo : http://jsfiddle.net/pmREJ/
If it's ok I want to insert this new element , not sort elements agian.