Вот более правильный вариант, вам правда уже быстрее меня ответили.
<script type="text/javascript">
(function () {
function makeArray() {
var arr1 = getArray("#ul1"),
arr2 = getArray("#ul2");
function getArray(selector) {
if (selector)
return Array.prototype.slice.apply(document.querySelector(selector).getElementsByTagName('li'))
.map(function (curr) {
return curr.innerHTML
})
return [];
}
for (var i = 0; len = arr2.length, i < len; i++) {
if (arr1.indexOf(arr2[i]) < 0)
arr1.push(arr2[i])
}
return arr1.join(", ");
};
document.getElementById('makeNewArray').onclick = function () {
var div = document.createElement('div');
div.innerHTML = makeArray();
body.appendChild(div);
};
})();
</script>
Но это легко понимаемый вариант с получением списков по отдельности.
Если же вам все равно сколько списков и не важно, откуда каждый элемент по отдельности, есть мегакороткий вариант:
<script type="text/javascript">
(function () {
function makeArray() {
return Array.prototype.slice.apply(document.querySelectorAll("li"))
.map(function (curr) {
return curr.innerHTML
})
.filter(function (item, pos, self) {
return self.indexOf(item) == pos;
})
.join(", ");
};
document.getElementById('makeNewArray').onclick = function () {
var div = document.createElement('div');
div.innerHTML = makeArray();
body.appendChild(div);
};
})();
</script>