Развернуть и свернуть с помощью CSS

Я создал в Jquery одну функцию, чтобы развернуть и свернуть содержимое div. Но сейчас я хотел бы сделать это только с помощью CSS, а также использовать изображение стрелки, как эти

Смотреть LivejsFiddle

Я также хотел бы удалить все эти теги span и оставить только div и его содержимое

Вот код у меня пока.

<div class='showHide'>
    <span class='expand'><span id="changeArrow">&#8593;</span>Line expand and collapse</span>
    <fieldset id="fdstLorem">Lorem ipsum...</fieldset>
</div>
$(document).ready(function () {
    $('.showHide>span').click(function () {
        $(this).next().slideToggle("slow");
        return false;
    });
    $(".showHide>span").toggle(function () {
        $(this).children("#changeArrow").text("↓");
    }, function () {
        $(this).children("#changeArrow").text("↑");
    });
});

Ответы на вопрос(3)

Ваш ответ на вопрос