Замена текста флажком с помощью ReplaceWith

Question

У меня возникла проблема с заменой текста на div, который включает в себя флажок. Когда у меня есть следующий код, текст успешно заменяется:

<p>Hello</p 
<p class="replaced">Hello</p> 
<p class="replaced">World</p> 

<script> 
$(".replaced").replaceWith("<div>REPLACING TEXT.</div>"); 

</script> 

Когда замена текста включает в себя флажок, однако, скрипт перестает работать. Конкретно, следующее не работает:

<p>Hello</p 
<p class="replaced">Hello</p> 
<p class="replaced">World</p> 

<script> 
$(".replaced").replaceWith("<div><input type="checkbox" id="fractionsandratioscheck1" class="checkappear"/>REPLACING TEXT.</div>"); 

</script> 

Если кто-то может объяснить, как исправить это, я был бы признателен. Благодаря!

Answer 1

ваша проблема в том, что вы используете HTML " внутри JavaScript "

вы должны использовать чередующимися кавычки внутри этой строки

$(".replaced").replaceWith("<div><input type="checkbox" id="fractionsandratioscheck1" class="checkappear"/>REPLACING TEXT.</div>"); 

это должно выглядеть примерно так

$(".replaced").replaceWith('<div><input type="checkbox" id="fractionsandratioscheck1" class="checkappear"/>REPLACING TEXT.</div>'); 

Answer 2

$(".replaced").replaceWith("<div><input type='checkbox' id='fractionsandratioscheck1' class='checkappear'/>REPLACING TEXT.</div>");//escape string properly

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p>Hello</p 
 
<p class="replaced">Hello</p> 
 
<p class="replaced">World</p>

Единственная проблема с ОП является "" изменить их ''