 <h2>Using native <code>Array.filter</code></h2> <p>If you are targeting only modern browsers (IE9+ or a <a href="http://kangax.github.com/es5-compat-table/" rel="nofollow">recent version</a> of any other major browser) you can use the JavaScript 1.6 array method <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/filter" rel="nofollow"><code>filter</code></a>.</p> <pre><code>var testItem, data = [{"id":"item-1","href":"google.com","icon":"google.com"}, {"id":"item-2","href":"youtube.com","icon":"youtube.com"}, {"id":"item-3","href":"google.com","icon":"google.com"}, {"id":"item-4","href":"google.com","icon":"google.com"}, {"id":"item-5","href":"youtube.com","icon":"youtube.com"}, {"id":"item-6","href":"asos.com","icon":"asos.com"}, {"id":"item-7","href":"google.com","icon":"google.com"}, {"id":"item-8","href":"mcdonalds.com","icon":"mcdonalds.com"}]; function getItemById(data, id) { // filter array down to only the item that has the id // https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/filter var ret = data.filter(function (item) { return item.id === id; }); // Return the first item from the filtered array // returns undefined if item was not found return ret[0]; } testItem = getItemById(data, 'item-3'); </code></pre> <p><a href="http://jsfiddle.net/cwGeu/2/" rel="nofollow">Working example</a></p> <h2>Manually looping over the data</h2> <p>If you can't use filter you are probably stuck with just using a loop:</p> <pre><code>var testItem, data = [{"id":"item-1","href":"google.com","icon":"google.com"}, {"id":"item-2","href":"youtube.com","icon":"youtube.com"}, {"id":"item-3","href":"google.com","icon":"google.com"}, {"id":"item-4","href":"google.com","icon":"google.com"}, {"id":"item-5","href":"youtube.com","icon":"youtube.com"}, {"id":"item-6","href":"asos.com","icon":"asos.com"}, {"id":"item-7","href":"google.com","icon":"google.com"}, {"id":"item-8","href":"mcdonalds.com","icon":"mcdonalds.com"}]; function getItemById(data, id) { var i, len; for (i = 0, len = data.length; i &lt; len; i += 1) { if(id === data[i].id) { return data[i]; } } return undefined; } testItem = getItemById(data, 'item-3'); </code></pre> <p><a href="http://jsfiddle.net/gMcRB/1/" rel="nofollow">Working example</a></p> <p>Even though brute-forcing it with a loop might seem less elegant than using <code>Array.filter</code>, it turns out that in most cases the <a href="http://jsfiddle.net/53v3G/" rel="nofollow">loop is faster than <code>Array.filter</code></a>.</p> <h2>Refactoring to an object instead of an array</h2> <p>The best solution, assuming that the <code>id</code> of each of your items is unique, would be refactoring the way you are storing the data. Instead of an array of objects, use an object that uses the <code>id</code> as a key to store an object containing the <code>href</code> and <code>icon</code> key/property values.</p> <pre><code>var data = { "item-1": {"href": "google.com", "icon": "google.com"}, "item-2": {"href": "youtube.com", "icon": "youtube.com"}, "item-3": {"href": "google.com", "icon": "google.com"}, "item-4": {"href": "google.com", "icon": "google.com"}, "item-5": {"href": "youtube.com", "icon": "youtube.com"}, "item-6": {"href": "asos.com", "icon": "asos.com"}, "item-7": {"href": "google.com", "icon": "google.com"}, "item-8": {"href": "mcdonalds.com", "icon": "mcdonalds.com"} }; </code></pre> <p>This would make accessing items even easier and faster:</p> <pre><code>var data = JSON.parse(localStorage.getItem("result")); data["item-3"].href; </code></pre>