css onmouseover causing DOM error

Question

I have a php generated HTML where I would like to add some css onmouseover functionality like below

<span id='".$id."' class='userInfo' onmouseover='hoverdiv(event,'popupUserInfoDiv')' onmouseout='hoverdiv(event,'popupUserInfoDiv')'>".$c["test"]."</span>

The javascript is not even added yet that if I mouseover I get the following error at the beginning of my DOM:

SyntaxError: Unexpected token '}'

EDIT: sorry if I was not clear enough but my code is PHP generated so I cannot use any double quote ? I tried and it breaks my page

Answer 1

As you're using double-quotes for your PHP string already and single-quotes for your HTML attributes, you won't be able to use single quotes for your JavaScript.

hoverdiv(event,'popupUserInfoDiv')

Convert your PHP string to a string block and that should free up your double-quotes, see below for an example of string-block.

<?php
    $str = <<<EOF
        <p>Hello</p>
        <p><?php echo _("World"); ?></p>
    EOF;
?>