JSFiddle - React, Tailwind, and code Playground

HTML

<select id="player"></select>
<div>
Expected Output -
<ul>
<li>Forwards (Strickers)</li>
<li>Fullbacks (Defenders)</li>
<li>Goalkeeper</li>
    <li>Midfielders</li>
    </ul>    
</div>

JavaScript

var res = '{"allSportPosition":{"25":"Forwards (Strickers)","27":"Fullbacks (Defenders)","28":"Goalkeeper ","26":"Midfielders"}}';


try{
var sportPositionOptions = '';    
var parsedJson = JSON.parse(res);
var allSportPosition = parsedJson.allSportPosition;
 
$.each(allSportPosition,function(atIndex, atValue){	    
    sportPositionOptions = sportPositionOptions+'<option value="'+atIndex+'">'+atValue+'</option>';            
});
$(sportPositionOptions).appendTo("#player");
    
}
catch(e){
    alert("Parsing error:"+ e); 
    }