how to add 'selected' attribute in <li> using jQuery or Javascript

You can use element.childNodes to get all children. Then iterate over them and remove the attribute selected with element.removeAttribute.

You can use element.textContent to get the content of the <li> element. If it fits your search you can then use element.setAttribute() to mark it as selected.

I prepared a small example of this here: https://jsfiddle.net/xLfp8z57/1/

<ul class="list">
  <li data-value="0" class="option" selected>All Categories</li>
  <li data-value="75" class="option">eBriefs</li>
  <li data-value="74" class="option">Hawkeye-articles</li>
  <li data-value="1" class="option">Hhhhh</li>
  <li data-value="93" class="option focus">Hyphen-Newsletter</li>
  <li data-value="95" class="option">Infographics</li>
  <li data-value="76" class="option">News</li>
  <li data-value="134" class="option">Podcast-webinar</li>
  <li data-value="79" class="option">Podcasts</li>
  <li data-value="81" class="option">Success Stories</li>
  <li data-value="94" class="option">Videos</li>
  <li data-value="77" class="option">Webinars</li>
  <li data-value="83" class="option">Whitepapers</li>
</ul>

<button id="btn">unselect all</button>

<button id="btn2">select all ending with 'r'</button>

document.getElementById("btn").addEventListener("click", event => unselectAll());
document.getElementById("btn2").addEventListener("click", event => selectSpecific());

function unselectAll() {
  let list = document.querySelector(".list")

  list.childNodes.forEach(item => {
    if (item.tagName === 'LI') {
      item.removeAttribute("selected")
    }
  });
}

function selectSpecific() {
  let list = document.querySelector(".list")

  list.childNodes.forEach(item => {
    if (item.tagName === 'LI' && item.textContent.endsWith("r")) {
      item.setAttribute("selected", "");
    }
  });
}

li[selected]{
  color: red;
}