Javascript-форум - Радио с помощью js

Написал сайт и теперь нужно создать для него радио, проблема в том, что сделать это нужно с помощью js (очень много радиостанций, а излишние страницы под каждый тип не нужен, громоздко).

Делаю поэтапно, пока пытаюсь вставить содержимое в один блок который создается. Такой блок планируется поместить в функцию с 3-мя параметрами
1 - название радио
2 - ссылка на радио
3 - ссылка на картинку

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

<!DOCTYPE html>
<html lang="ru">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
#list {
	list-style-type: none;
	display: block;	
}
</style>
 </head>


<body>

<div class="radio-playlist">
		<ul id="list">
			<li><script src="css/radio_anime.js"></script></li>
			<li><script src="css/radio_anime.js"></script></li>
			<li><script src="css/radio_anime.js"></script></li>
			<li><script src="css/radio_anime.js"></script></li>
		</ul>
<!--
не знаю как сделать так, чтобы он запустил скрипт без имени.
так будет выглядеть скрипт в коде. 
радиостанции выстраиваются одна за другой и линию.
-->


<script >

var parent = document.getElementsByClassName('radio-playlist')[0]; //получаем ссылку на элемент body
var elem_div = document.createElement('div');// создаст элемент div
//var new_element = document.createElement('p')
var node_img = this.document.createElement("img");
var node_a = this.document.createElement("a");  

//elem_div.className = 'my-class'
elem_div.id = 'radio_anime'
elem_div.style.width = '100px';
elem_div.style.height = '100px';
elem_div.style.background = '#c5c5c5';
elem_div.style.border = '1px solid gray';
elem_div.style.position = 'relative';
elem_div.style.float = 'left';
elem_div.style.margin = '10px';

//new_element.innerHTML = "radio2";
//new_element.style.textAlign= "center"; 

node_img.src = "svet.png";

node_a.innerHTML = "radio2";
node_a.href = "#";

*!*

this.parent.appendChild(elem_div); // вставляем элемент div
//this.parent.appendChild(new_element);

this.document.getElementById("radio_anime").appendChild(node_img); 
this.document.getElementById("radio_anime").appendChild(node_a); 

/*
this.document.getElementById('my').innerHTML =this.document.getElementById("radio_anime").appendChild(node_a) + this.document.getElementById("radio_anime").appendChild(node_img);
*/

*/!*


</script>


 </body>
</html>

var parent = document.getElementsByClassName('radio-playlist')[0]; //получаем ссылку на элемент body
var elem_div = document.createElement('div');// создаст элемент div
//var new_element = document.createElement('p')
var node_img = this.document.createElement("img");
var node_a = this.document.createElement("a");  

//elem_div.className = 'my-class'
elem_div.id = 'radio_anime'
elem_div.style.width = '100px';
elem_div.style.height = '100px';
elem_div.style.background = '#c5c5c5';
elem_div.style.border = '1px solid gray';
elem_div.style.position = 'relative';
elem_div.style.float = 'left';
elem_div.style.margin = '10px';

//new_element.innerHTML = "radio2";
//new_element.style.textAlign= "center"; 

node_img.src = "svet.png";

node_a.innerHTML = "radio2";
node_a.href = "#";

*!*

this.parent.appendChild(elem_div); // вставляем элемент div
//this.parent.appendChild(new_element);

this.document.getElementById("radio_anime").appendChild(node_img); 
this.document.getElementById("radio_anime").appendChild(node_a); 

/* 
Этот код не работает, по отдельности вставляет без проблем, 
но как поместить в один созданный блок? 

this.document.getElementById('my').innerHTML =this.document.getElementById("radio_anime").appendChild(node_a) + this.document.getElementById("radio_anime").appendChild(node_img);
*/

*/!*