При клике на checkbox добавлялся код в textarea — как сделать?

Question

[alexwww91]

Привет всем, я только учусь и возможно вопрос глупый) не обессудьте, в гугле не нашел ничего конкретного.

Задача такая. Есть чекбоксамы:

<div>
		<p><input type="checkbox" id="vk-checked" value="vkontakte">
		<span>
			<img src="">
		</span>
		<span>
			Вконтакте
		</span></p>
		<p><input type="checkbox" id="fb-checked" value="facebook">
		<span>
			<img src="">
		</span>
		<span>
			Facebook
		</span></p>
		<p><input type="checkbox" id="ok-checked" value="odnoklassniki">
		<span>
			<img src="">
		</span>
		<span>
			Одноклассники
		</span></p>
	</div>

Есть textarea:

<div>
		<textarea id="code-result" cols="30" rows="10">
			<div class="ya-share2" data-services=""></div>
		</textarea>
	</div>

Подскажите, как в js или jquery прописать, чтобы при клике на какой-то чекбокс добавлялось его значение в data-services (если чекнуто два и более, то между значениями нужна запятая), пример: чекаем Вконтакте и Facebook, а textarea становится таким:

<div>
		<textarea id="code-result" cols="30" rows="10">
			<div class="ya-share2" data-services="vkontakte,facebook"></div>
		</textarea>
	</div>

ВАЖНО! Именно в теге textarea

Answer 1

[Юпитер Макс]

тут есть примеры

Answer 2

[Игорь]

вот так

Comments

[alexwww91]

Один момент, очень важно чтобы это все было внутри textarea

[Игорь]

alexwww91, Так измените то куда выводить.

[alexwww91]

loonny, дело в том, что внутри textarea div уже не тег, а просто текст. Не понимаю логику и какими инструментами нужно именно там вывести.

[Игорь]

alexwww91, ну вы можете выводить через $('textarea').val(). Или использовать div с атрибутом contenteditable