Oh, I see there is already an answer. Even if mine is not that elegant and still has one bug I'll post it because maybe you could learn something about selectors and stuff ;)
Here is the fiddle:
http://jsfiddle.net/9yvZE/
The problem is that the values aren't the concurrent one. Maybe if you add an eventlistener or use another method than html() it could work as expected:
$(document).ready(function () {
function sortList() {
var ul = $('#my_list');
var vals = [];
$('#my_list li input.input1').each(function (index) {
vals.push($(this).val());
});
vals.sort();
for (var i = 0; i <= vals.length; i++) {
$('#my_list li input.input1').each(function () {
if (vals[i] == $(this).val()) {
if ($('#my_list li').eq(i).children('input.input1').val() !== vals[i]) {
var list_el1_index = $('#my_list li').index();
var list_el1 = $('#my_list li').eq(list_el1_index).html();
var list_el2 = $('#my_list li').eq(i).html();
$('#my_list li').eq(list_el1_index).html(list_el2);
$('#my_list li').eq(i).html(list_el1);
}
}
});
}
}
$('#test').click(function () {
sortList();
});
});
HTML:
<p id ="test">Sort</p>
<ul id="my_list">
<li>
<input type="text" class ="input1" value="Attila">
<div class="other">text here </div>
<input type="text">
</li>
<li>
<input type="text" class ="input1" value="Andrea">
<div class="other">text here </div>
<input type="text">
</li>
<li>
<input type="text" class ="input1" value="Jimmy">
<div class="other">text here </div>
<input type="text">
</li>
</ul>