Анализировать текст, есть HTML внутри

Question

У меня есть следующий текст

let text = "La altura del Monte Everest es <select class='cs-select cs-skin-slide' id='memorySelect'></select> y es por eso considerado el monto más alto del mundo" 

После добавления выбора параметров с помощью JS, я добавляю в моем теле, как это.

$('body').html(text) 

Так что мой результат заключается в следующем

Вот где проблема !. Является ли моя строка мне нужно HTML для разбора в БЛИЖНЕМ текста, НЕ в конце

Таким образом, результат будет следующим

Почему HTML идет вниз ? Я пробовал то же самое с тремя структурами HTML, и все 3 спускаются, а текст остается наверху.

UPDATE: Это CSS из SELECT,

display: inline; 
vertical-align: middle; 
position: relative; 
text-align: left; 
z-index: 100; 
background: #292f33; 
max-width: 500px; 
user-select: none; 

Answer 1

Попробуйте сделать это:

let text = "<p>La altura del Monte Everest es </p><select class='cs-select cs-skin-slide' id='memorySelect'></select><p>y es por eso considerado el monto más alto del mundo</p>" 

А затем отображать элементы инлайн. Должен работать :)

Answer 2

Как выглядит ваш CSS? Является ли элемент выбора отображаемым в строке? Также рассмотрите обертывание текста в тегах <p>. Потому что ваш код без CSS работает как задумано:

let text = "La altura del Monte Everest es <select class='cs-select cs-skin-slide' id='memorySelect'></select> y es por eso considerado el monto más alto del mundo" 
 

 
$('body').html(text)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>