Question

I want to add a table to my website with jquery´s append function when the user hovers over the image $(“#dot0003”). Dreamweaver already tells me that there is a syntax error but I don’t understand where.

$(document).ready(function() {

$("#dot0003").hover(
    function(){

        $("#tablespace").append('

        <table  id="table1" class="info0004" border="4">
        <tr>
        <td>roomnumber</td>
        <td>200</td>
        </tr>
        <tr>
        <td>number of bathrooms</td>
        <td>2</td>
        </tr>
        <tr>
        <td>number of beds</td>
        <td><img src="_index/_dots/dot.gif" width="20" height="20"></td>
        </tr>
        </table>')

})
})

Any help appreciated!

Answer 1

Are you sure this is what you’re trying to do? Meaning, when you hover over dot0003, it’s going to keep trying to append this data. See the fiddle here.

With that said, your issue is with your spaces. See the fiddle above. Either remove your spaces or build your string like:

var myContent = '<table  id="table1" class="info0004" border="4">'
myContent += '<tr>'
...

But this produces invalid HTML markup as your adding tables in your table like such:

<table>
    <tr><td></td></tr>
    <table>
    ...

I think you should use jQuery’s after method instead of append.

Good luck.