Replacing div html() by echoing PHP - how to? - php

Question

I have a multiple product elements that get their class and ID from PHP:
$product1["codename"] = "product-1";
$product1["short"] = "Great Product 1";
$product2["codename"] = "product-2";
$product2["short"] = "Great Product 2";
<div class="leftMenuProductButton" id="'. $product1["codename"].'" >'. $product1["short"].'</div>
<div class="leftMenuProductButton" id="'. $product2["codename"].'" >'. $product2["short"].'</div>
These display as:
<div class="leftMenuProductButton" id="product-1" > Great Product 1</div>
<div class="leftMenuProductButton" id="product-2" > Great Product 2</div>
In the page, I have an element that I want to replace the HTML:
<div id="productPopupTop">
//Replace this content
</div>
Using jquery, I have tried the following:
$( '.leftMenuProductButton' ).hover (
function () {
var swapNAME = $(this).attr("id"); //gets the ID, #product-1, #product-2 etc. This works.
$("#productPopupTop").html(' <? echo $' + swapNAME + '["short"] ?>'); //This is supposed to get something like <? echo $product-1["short"] ?> This doesn't appear to work.
},
function () {
//this is just here for later
});
If I try to do an alert('<? echo $' + swapNAME + '["short"] ?>'); it will literally display something like <? echo $product-1["short"] ?>
Please note that both the Javascript and the PHP are externally linked in a PHP file (index.php <<< (js.js, products.php)
QUESTION: How do I replace the HTML() of #productPopupTop with the ["short"] of a product? If I should use Ajax, how would I code this?

Answer 1

try this:
$( '.leftMenuProductButton' ).hover (
function () {
$("#productPopupTop").html($(this).html());
},
function () {
//this is just here for later
});

Answer 2

As knittl mentioned, php is a pre-processor on the server, and can't do anything once the page has been sent to the client.
The options I can think of are
Store the product information in javascript on the client (i.e. a javascript array that is populated with php)
Use ajax to query the server with a codename and receive the corresponding data (i.e. server.com/getshort.php?codename=product-2, which would respond with Great Product 2).
If the text within the tag is always the same, #Kasia's answer will work, and is simpler.