チェックボックスの値を取得して<li>タグで表示させたい

Question

前提・実現したいこと

チェックボックスの値を取得して、値を<p>タグで自動表示させるところまではできたのですが、
チェックされた値を<li>タグで表示させたいです。
jQueryも読み込んでいます。

【例：REDとGREENがチェックされた場合】
（現在）<p>RED,GREEN</p>
（希望）<ul><li>RED</li><li>GREEN</li></ul>

よろしくお願い致します。

該当のソースコード

<label><input type="checkbox" name="color" value="RED" />RED</label>
<label><input type="checkbox" name="color" value="BLUE" />BLUE</label>
<label><input type="checkbox" name="color" value="GREEN" />GREEN</label>

<p class="result"></p>

$(function(){
    $('[name="color"]').change(function(){
        var aryCmp = [];
        $('[name="color"]:checked').each(function(index, element){
            aryCmp.push($(element).val());
        });
        $('.result').html(aryCmp.join(','));
    });
});

Answer 1

<ul class="result"></ul>

$('.result').html('<li>'+aryCmp.join('</li><li>')+'</li>');

Comments

[inquirer]

回答ありがとうございます。
希望通りになりました。