Some example media queries.

mediaqueries.html

<ul>
  <li data-email="jim@example.com">Jim</li>
  <li data-email="julie@example.com">Julie</li>
  <li data-email="jay@example.com">Jay</li>
  <li data-email="jennie@example.com">Jennie</li>
</ul>  

script.js

//none

style.css

@media screen and (min-width: 1100px) {
  body {
    background: darkorange;
  }
  ul li:after {
    content: " (" attr(data-email) ")";  
  }
}
@media screen and (max-width: 1099px) and (min-width: 820px) {
  body {
    background: cornflowerblue;
  }
}
@media screen and (max-width: 819px) and (min-width: 600px) {
  body {
    background: khaki;
  }
  ul li {
    list-style: none;
    margin: 0;
  }
}
@media screen and (max-width: 599px) {
  body {
    background: palegoldenrod;
  }
  ul li {
    list-style: none;
    display: inline;
  }
  ul li:after {
    content: ", ";
  }
  ul li:last-child:after {
    content: none;
  }
}