How to use elements returned from browser.elements()?
<p>The following code is designed to gather the elements having their <code>href attribute</code> beginning with "/assets/css/" as per <a href="http://webdriver.io/api/protocol/elements.html" rel="nofollow">this</a>.
Yet the first attempt to access either <code>browser.elementIdAttribute(iter1, 'href').value</code> or <code>browser.elementIdAttribute(iter1, 'href')</code> crashes with the following error</p>

<blockquote>
  <p>TypeError: Cannot read property 'value' of undefined</p>
</blockquote>

<pre class="lang-js prettyprint-override"><code>var styleSheetsElems = browser.elements('[href^="/assets/css/"]').value; 

for (let iter1 in styleSheetsElems)
{ 
    console.log( browser.elementIdAttribute(iter1, 'href').value );
};
</code></pre>

<ul>
<li>Here I can see that the elements exist( I can traverse the Array though I don't try to print).</li>
</ul>

<p>My understanding is that <strong><em>The populating of <code>styleSheetsElems</code> should vouch for the elements existing and having an href ...</em></strong> </p>

<p>printing .<code>elements('[xyz]')</code> results in </p>

<pre><code>{ state: 'success',
  sessionId: '652f9f1c-6cad-42d7-89a3-e09a1acbd1af',
  hCode: 1951176523,
  value: 
  [{ ELEMENT: '11' },
   { ELEMENT: '12' },
   { ELEMENT: '88' }],
  class: 'org.openqa.selenium.remote.Response',
  selector: '[xyz]',
  _status: 0 }
</code></pre>

<p>so no luck there... digging further</p>