Align nested list element horizontally to outer element from js

I have a list element added into an html file from javascript that is initiated like:

<li class="left">${data1}<li class="right">${data2}</li></li>;

However, this aligns data1 above data2. How can I align data1 and data2 horizontally?