JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<ul class="ulContainer">
<li>test1</li>
<li>test2</li>
<li>test3</li>
</ul>

CSS

.ulContainer li{
  width:200px;
  height:20px;
  background-color:#9abff9;
  list-style-type:none;
  margin:10px 0 10px 0;
  padding: 3px 3px 3px 5px;
  border-radius: 10px 2px 2px 10px;
  
}

JavaScript

$('.ulContainer li:first').css('border-top-right-radius','10px');
$('.ulContainer li:last').css('border-bottom-right-radius','10px');