Get value from json in jQuery

Question

I have this json

"urls": {
      "title1": {
        "url": "someurl1"
      },
      "title12": {
        "url": "someurl2"
      }
    }

I want get title and value of url out in an element for each. Something like this

$.each(value.urls, function (key, value) {
    $('.log-list-js').append('<a href="'+ title +'">'+ someurl +'</a>');
});

Hope it makes sense.

Can you help me ?

Anton · Accepted Answer · 2013-11-18 12:59:53Z

2

Try this

   var values = {
        "urls": {
            "title1": {
                "url": "someurl1"
            },
            "title12": {
                "url": "someurl2"
            }
        }
    }
    for (var key in values.urls) {
        $('.log-list-js').append('<a href="' + values.urls[key].url + '">' + values.urls[key].url + '</a>');
    }

DEMO

answered Nov 18, 2013 at 12:59

Anton

32.6k5 gold badges47 silver badges54 bronze badges

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

2 Comments

Newcoma Over a year ago

Thanks, but what about the title? That should be the text of each element?

Newcoma Over a year ago

I found out 'key' : )

Kaushik · Accepted Answer · 2013-11-18 13:01:00Z

0

$('.log-list-js').append('<a href="' + value.urls[key].url + '">' + value.urls[key].url + '</a>');

This is format

answered Nov 18, 2013 at 13:01

Kaushik

2,0901 gold badge24 silver badges32 bronze badges

Comments

Ruwanka De Silva · Accepted Answer · 2013-11-18 13:37:13Z

Your json should be converted to object first, use JSON.parse method if you are having a json string. object should something like this

urls = {
      "title1": {
      "url": "someurl1"
      },
      "title12": {
        "url": "someurl2"
      }
    };

then your method is correct with some corrections to the code

$.each(urls, function(index, value){
    $('.log-list-js').append('<a href="'+ index +'">'+ value.url +'</a>');
});

here is the demo on jsfiddle

Collectives™ on Stack Overflow

Get value from json in jQuery

3 Answers 3

2 Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Related