Error Appending Simple HTML - Jquery

Question

I have got stuck in seemingly basic thing. My question is why is the simple html command not appending to the div?

Here is my XML Data:

    <?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<collection>

    <ErrorOps>
        <aErrorID>53f4760f2af5422ac99af750</aErrorID>
        <bErrorName>RMOB RULE_INFO_2</bErrorName>
        <cErrorCause>Database Out Of Sync</cErrorCause>
        <dErrorResolution>Try clearing your cache, or check database ver</dErrorResolution>
        <eErrorTD>{ &quot;Java Null ??&quot; : 203 , &quot;Java File ??&quot; : 102}</eErrorTD>
    </ErrorOps>

    <ErrorOps>
        <aErrorID>53f4760f2af5422ac99af751</aErrorID>
        <bErrorName>ERROR X_2609</bErrorName>
        <cErrorCause>CAUSE X_2609</cErrorCause>
        <dErrorResolution>PERFORM X_2609</dErrorResolution>
        <eErrorTD>{ &quot;Java X_2609_1&quot; : 203 , &quot;Java X_2609_2&quot; : 102}</eErrorTD>
    </ErrorOps>

    <ErrorOps>
        <aErrorID>53f476f32af54609aefcd02a</aErrorID>
        <bErrorName>ERROR TR_1156</bErrorName>
        <cErrorCause>CAUSE TR_1156</cErrorCause>
        <dErrorResolution>RESOLUTION TR_1156</dErrorResolution>
        <eErrorTD>{ &quot;Java F_1345_1&quot; : 267 , &quot;Java F_1345_2&quot; : 982}</eErrorTD>
    </ErrorOps>

    <ErrorOps>
        <aErrorID>53f4760f2af5422ac99af752</aErrorID>
        <bErrorName>ERROR Y_2609</bErrorName>
        <cErrorCause>CAUSE Y_2609</cErrorCause>
        <dErrorResolution>PERFORM Y_2609</dErrorResolution>
        <eErrorTD>{ &quot;Java Y_2609_1&quot; : 203 , &quot;Java Y_2609_2&quot; : 102}</eErrorTD>
    </ErrorOps>

</collection>

And here is my HTML code:

    <!DOCTYPE html>
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        $('#car').click(function() {
            $.ajax({
                type: "GET",
                url: "data.xml",
                dataType: "xml",
                success: function (data) {
                    $('#content').empty();
                    $(data).find('ErrorOps').each(function(){
                        //var html = '<p> Sample Text </p>';    
                        $('#content').append("<p>Text</p>");
                        }
                    });
                },
                cache: false
                });
            return false;
        });
    });
    </script>
</head>
<body>

<a href="#" id="car">Car</a>
<div id="content">
</div>
</body>
</html>

Can anybody please tell me what is the problem? I think Text should get appended 4 times.

dataType is set to xml, so shouldn't it parse into XML document automatically? — Anthony
– Anthony, Commented Aug 22, 2014 at 9:16
Then how does the code in this page work? jquerybyexample.net/2012/04/… — G.One
– G.One, Commented Aug 22, 2014 at 9:19

jondinham · Accepted Answer · 2014-08-22 09:20:03Z

1

You have an extra closing curly bracket right after

$('#content').append("<p>Text</p>");

Please remove that closing curly bracklet. I've tested the code after removing it, all fine!

answered Aug 22, 2014 at 9:20

jondinham

8,53719 gold badges87 silver badges139 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

G.One Over a year ago

Oops! Very very embarrassing mistake!

Collectives™ on Stack Overflow

Error Appending Simple HTML - Jquery

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related