Как перевести на курсив только одно значение вывода javascript?

Question

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

function notEmpty() {
  var myText1 = document.getElementById('txf1');
  var myText2 = document.getElementById('txf2');
  var myText3 = document.getElementById('txf3');
  var myText4 = document.getElementById('txf4');
  var myText5 = document.getElementById('txf5');

  if (myText1.value != "" && myText2.value != "" && myText3.value != "" && myText4.value != "" && myText5.value != "")
    document.getElementById("result").innerHTML = "Cópiala y pégala en tu documento.  La ficha bibliográfica es : <br /><br />   " + myText1.value + ". (" + myText2.value + "). " + myText3.value + '. ' + myText4.value + ": " + myText5.value + ".";
  else {
    alert("Rellena todos los huecos, por favor.");
  }
}

h1 {
  position: relative;
  background-color: rgb(127, 159, 219);
  font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
  color: white;
  text-align: left;
  font-size: 30px;
  margin-top: 0px;
  height: 70px;
  border-bottom-style: solid;
  border-color: black;
  border-width: 2px;
}

body {
  width: 100%;
  height: 100%;
  margin: 0%;
  padding: 0%;
  left: 0%;
  top: 0%;
  background-color: darkred;
  font-size: 12px;
  text-align: left;
  color: white;
}

button {
  font-size: 15px;
  margin-left: 40%;
}

<p>Autor(es):<input id="txf1" style="float:right; padding-right: 6px;" type="text"></p>

<p>Fecha de publicación:<input id="txf2" style="float:right; padding-right: 6px;" type="text"></p>

<p>Título:
  <input id="txf3" style="float:right; padding-right: 6px;" type="text">
</p>
<p>Lugar de publicación:
  <input id="txf4" style="float:right; padding-right: 6px;" type="text">
</p>

<p>Editorial:
  <input id="txf5" style="float:right; padding-right: 6px;" type="text">
</p>

<br>
<br>
<button onclick="notEmpty()">Genera</button>
<br>
<br>
<br>
<hr>
<div id="result" contenteditable="true"></div>
<hr>

Я просто хочу показать значение myText3 курсивом, когда пользователь получает все это.Я хотел бы избежать Jquery, так как я стараюсь сосредоточиться на изучении только javascript и не чувствовать себя перегруженным, но я также был бы признателен за примеры Jquery :).Большое спасибо за помощь заранее.

Answer 1

Измените эту строку:

document.getElementById("result").innerHTML = "Cópiala y pégala en tu documento.  La ficha bibliográfica es : <br /><br />   " + myText1.value + ". (" + myText2.value + "). " + myText3.value + '. ' + myText4.value + ": " + myText5.value + ".";

На

document.getElementById("result").innerHTML = "Cópiala y pégala en tu documento.  La ficha bibliográfica es : <br /><br />   " + myText1.value + ". (" + myText2.value + "). <em>" + myText3.value + '</em>. ' + myText4.value + ": " + myText5.value + ".";

Обтекание text3.value в тегах выделения заставит его выделяться курсивом.