jQuery - Further seperate code from design.

[eluser]SpooF[/eluser]
So I've just recently really discovered what jQuery can do and I'm very intrigue. I was looking at how I currently disburse passed variables through out my views and thought I wonder if jQuery could clean this up. So now I'm looking into a way to further use jQuery to seperate my code from the design. with the val() and attr() functions it makes it really quite easy to do with forms. Has anyone else done anything like this?

The next thing I'm looking into is how to deal with foreach, and also seeing if there is a way to utilize php and javascripts to cut down on the amount of jQuery written by hand.

Here is a small exmaple, it may look crazy and you may ask why, and whats the point.

Code:

$(document).ready(function(){
        window.onload = function(){
            $('div#ticket input[name="open"]').attr("checked","<?=($vars->ticket->tic_open==1) ? 'checked' : '' ;?>");
            $('div#ticket input[name="resolve"]').attr("checked","<?=($vars->ticket->tic_resolve==1) ? 'checked' : '' ;?>");
            $('div#ticket input[name="subject"]').val("<?=$vars->ticket->tic_subject?>");
            $('div#ticket input[name="id"]').val("<?=$vars->ticket->tic_id?>");
            $('div#ticket li[name="from"]').html($('div#ticket li[name="from"]').html() + " <?=$vars->ticket->con_firstn?> <?=$vars->ticket->con_lastn?> (<?=$vars->ticket->cli_username?>)");
            $('div#ticket li[name="subject"]').html($('div#ticket li[name="subject"]').html() + " <?=$vars->ticket->tic_subject?>");
            $('div#ticket li[name="topic"]').html($('div#ticket li[name="topic"]').html() + " <?=$vars->ticket->tic_topic?>");
            $('div#ticket li[name="website"]').html($('div#ticket li[name="website"]').html() + " <?=$vars->ticket->web_address?>");
         }

        $('div#ticket a#update').click(function () {
               $.post('/cp/ticket/update', {
                   id: $('div#ticket input[name="id"]').val(),
                open: $('div#ticket input[name="open"]').attr("checked"),
                resolve: $('div#ticket input[name="resolve"]').attr("checked")
            }, function(data) {
                if(data==1) {
                    $('span[name="info"]').html('Updated');
                    if($('div#ticket input[name="open"]').attr("checked")==true) {            
                        $('div#ticket input[name="open"]').attr("disabled","disabled");
                    }
                    if($('div#ticket input[name="resolve"]').attr("checked")==true) {            
                        $('div#ticket input[name="resolve"]').attr("disabled","disabled");
                    }
                } else {
                    $('span[name="info"]').html('Error');    
                }
                $('span[name="info"]').fadeIn('slow');
                $('span[name="info"]').fadeOut(3000);
            });
        });
     });


<span>&lt;a href="#" onclick="onClick=history.back()"&gt;Go Back</a></span>
<span name="info" style="display:none">Updated</span>
<h2>Ticket</h2>
    <div id="ticket">
        <ul>
            <li name="from">From:</li>    
            <li name="subject">Subject:</li>
            <li name="topic">Topic:</li>
            <li name="website">Website:</li>
        </ul>
        <span>Message</span>
        <p>&lt;?=$vars->ticket->tic_message?&gt;</p>
    
        &lt;form name="ticket"&gt;
            <a href="#" id="update">Update</a>
            &lt;input type="hidden" name="subject" value=""&gt;
            &lt;input type="hidden" name="id" value=""&gt;
            <label>&lt;input type="checkbox" name="open" value="1"&gt; Open</label>
            <label>&lt;input type="checkbox" name="resolve" value="1"&gt; Resolved</label>
            <br>
            &lt;textarea&gt;&lt;/textarea&gt;
            <a href="#" id="respond">Respond</a>
        &lt;/form&gt;
    </div>

I know a lot of people don't care because they are the ones design the page too, so it doesn't bother them.

I was just wondering what your thoughts of using jQuery to reduce the amount of code inside of design is.