Dynamic PHP vars with unobtrusive JS

Dynamic PHP vars with unobtrusive JS

Hello!,

I'm a newbie in JQuery, and since I work with it I follow the principles of unobtrusive JS; however, since I don't know how to pass PHP dynamic variables to my JQuery scripts I always end up doing weird things like the following:

In my HTML+PHP:

        <div id="mapPanel">
            <ul>
                <li><?php echo $company['Company']['latitude']; ?></li>
                <li><?php echo $company['Company']['longitude']; ?></li>
                <li><?php echo $company['Company']['company']; ?></li>
                <li><?php echo $company['Company']['google_address']; ?></li>
            </ul>
        </div>

In my JQuery script:
  
    params = $JQ('#mapPanel ul li');
    printMap(    'mapPanel',
                params[0].firstChild.nodeValue,
                params[1].firstChild.nodeValue,
                params[2].firstChild.nodeValue,
                params[3].firstChild.nodeValue);

Here, I write my dynamic vars into a list and then collect them in the client side in order to update the DOM and print the corresponding Google map. My question: how must I program this in a smarter way?

Thanks a lot in advance for any reply :-)