ansaurus

Question

Answer 1

+1 A:

Have you tried switching the single and double quotes?

$("#clips").after('<ul id="slideshow-nav"><li><a id="gallery-next" href="#" title="View the next piece">Next</a></li><li><a id="gallery-prev" href="#" title="View the previous piece">Prev</a></li></ul>');

jimyi 2009-09-04 20:59:41

Answer 2

+1 A:

Have you considered:-

$("#clips").after('<ul id="slideshow-nav"><li><a id="gallery-next" href="#" title="View the next piece">Next</a></li><li><a id="gallery-prev" href="#" title="View the previous piece">Prev</a></li></ul>')

?

Whilst its quite normal to have ' and " usage interchangable in Javascript usage of ' to delimit attribute values in HTML / XML is rare.

AnthonyWJones 2009-09-04 20:59:59

Answer 3

+1 A:

I can't reproduce the error in FF3.5.

<div id="clips">test</div>
<script type="text/javascript">
  $("#clips").after("<ul id='slideshow-nav'><li><a id='gallery-next' href='#' title='View the next piece'>Next</a></li><li><a id='gallery-prev' href='#' title='View the previous piece'>Prev</a></li></ul>");
</script>

gives me:

<div id="clips">test</div>
<ul id="slideshow-nav">
  <li><a title="View the next piece" href="#" id="gallery-next">Next</a></li>
  <li><a title="View the previous piece" href="#" id="gallery-prev">Prev</a></li>
</ul>

Joe 2009-09-04 21:00:22

Answer 4

+1 A:

Works fine for me in FF 3.5.2. Are you wrapping it in $(function() { }); to make sure that the DOM is loaded?

<html>
<head>
<title>tt</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"&gt;&lt;/script&gt;
<script type="text/javascript">
    $(function() {
         $("#clips").after("<ul id='slideshow-nav'><li><a id='gallery-next' href='#' title='View the next piece'>Next</a></li><li><a id='gallery-prev' href='#' title='View the previous piece'>Prev</a></li></ul>");
    });
</script>
</head>

<body>
<div id='clips'></div>
</body>
</html>

tvanfosson 2009-09-04 21:04:06

Answer 5

A:

Looks good. A few things to try:

Restructure for readability (is same code, using an array with a .join('') on the end):

$("#clips")
.after( [
   "<ul id='slideshow-nav'>",
       "<li><a id='gallery-next' href='#' title='Next piece'>Next</a></li>",
       "<li><a id='gallery-prev' href='#' title='Previous piece'>Prev</a></li>",
   "</ul>"
].join('')
);

Rename ids just to make sure there are no conflicts on the page (often has odd errors):

$("#clips")
.after( [
   "<ul id='slideshow-nav2'>",
       "<li><a id='gallery-next2' href='#' title='Next piece'>Next</a></li>",
       "<li><a id='gallery-prev2' href='#' title='Previous piece'>Prev</a></li>",
   "</ul>"
].join('')
);

Use all double quotes with escape characters:

$("#clips")
.after( [
   "<ul id=\"slideshow-nav2\">",
       "<li><a id=\"gallery-next2\" href=\"#\" title=\"Next piece\">Next</a></li>",
       "<li><a id=\"gallery-prev2\" href=\"#\" title=\"Previous piece\">Prev</a></li>",
   "</ul>"
].join('')
);

Matt Gardner 2009-09-04 21:04:28

Answer 6

A:

Hmm this is working for me?

http://pastebay.com/51896

GaVrA 2009-09-04 21:05:11

Answer 7

A:

Both single and double quotes are valid in JavaScript and HTML:

HTML: "Double style quotes are the most common, but single style quotes are also allowed."

JavaScript: "A string literal is zero or more characters enclosed in single or double quotes."

Kobi 2009-09-04 21:31:14

ansaurus

tags:

views:

answers:

JQuery line is breaking my page

related questions