sage88
sage88

Reputation: 4574

jQuery Add a span element within a paragraph element that is being added to the DOM

Using jQuery DOM elements, I am trying to add a couple paragraphs to a div. This is the code that does this and it is functional:

$('#detail_overlay').append($('<p/>', { "class" : "detail_txt" })
  .text( $('#data_div').data('paint_name') + " detail, " + $('#data_div').data('paint_date') ))
  .append($('<p/>', { "class" : "detail_txt" })
  .text( $('#data_div').data('paint_dim' )));

The output looks like:

Freight Vessel on Puget Sound detail, 2013
40" x 26"

I need to make the word "detail" italicized by wrapping it in a span tag. I cannot seem to figure out how to add a span tag within a paragraph element.

Upvotes: 0

Views: 1040

Answers (1)

Dipesh Parmar
Dipesh Parmar

Reputation: 27364

Try

 + " <i>detail, </i>" + 

and instead of wrapping it into .text() wrap it into .html()

So your code would be,

.html( $('#data_div').data('paint_name') + "<i> detail</i>, " + 
$('#data_div').data('paint_date') ))

Upvotes: 2

Related Questions