Building HTML and appending using jQuery

I'm stuck with a scenario such as the following:

$(document).ready(function () {
        var param1 = "A";
        var param2 = "B";
        var param3 = "C";
        $("ul#SomeUL").append('<li><%: Ajax.ActionLink("Click Me", "SomeAction",  new { param1 = "' + param1 + '", param2 = "' + param2 + '", param3 = "' + param3 + '" }, new AjaxOptions() { OnSuccess = "onSuccess" }, new { Class = "ABC" } ) %></li>');

Now the problem is that instead of the value of each of the param# variables being "inserted"...the variable name itself (e.g. param1) gets "inserted"...in other words the routeValues being posted to the controller action are param1, param2, and param3 instead of A, B, and C...does anyone know why this is 开发者_开发百科happening and how to fix it?

Thanks D

ActionLinks are useless in this case as they are server side code. You cannot mix them with client side javascript variables. Here's how I would do it (embracing the full power of jQuery):

$(function () {
    var param1 = 'A';
    var param2 = 'B';
    var param3 = 'C';
    $('ul#SomeUL').append(
        $('<li/>', {
            html: $('<a/>', {
                href: '<%= Url.Action("SomeAction") %>',
                text: 'Click Me',
                class: 'abc',
                click: function() {
                    var params = { 
                        param1: param1, 
                        param2: param2, 
                        param3: param3 
                    };
                    $.get(this.href, params, function(result) {
                        onSuccess();
                    });
                    return false;
                }
            })
        })
    );
});