p inner_body = %(<div class="thread">あ</div>) #=> "<div class=\"thread\">あ</div>"

以下は、jsCode を、puts, p したもの

(A) element.innerHTML = "#{ inner_body }"; の場合

var element = document.querySelector('body');
element.innerHTML = "<div class="thread">あ</div>";

"var element = document.querySelector('body');\n
element.innerHTML = \"<div class=\"thread\">あ</div>\";\n"

(B) element.innerHTML = '<div class="thread">あ</div>'; の場合

var element = document.querySelector('body');
element.innerHTML = '<div class="thread">あ</div>';

"var element = document.querySelector('body');\n
element.innerHTML = '<div class=\"thread\">あ</div>';\n"

A は、" の対応が崩れるから、ダメ。
一方、B は正常に処理される

どうやれば、変数をBのように展開できるのか？