Если я вас правильно понял, код будет примерно такой:
var content = $('.pagination').find('span').text(); //запомним номер пункта
$('.pagination').find('span').appendChild(document.createElement('a')); //создадим 'a' и добавим в span
$('span > a')
.attr('href','#') //доводим до рабочего состояния
.text(content) //всталяем номер пункта
.addClass('current'); //т.к. мы работаем со span, то по логике этот пункт полюбому активен
//соответственно если пункт неактивен он неокажется в span
$('span > a').unwrap(); //заменяем span на a
А насчёт назад вперед...просто добавьте в нужные ссылки тег img примерно вот так:
$('a').appendChild(document.createElement('img'));
$('a > img').attr('scr','myimage.jpg');