Extra newline <br> seems to appear when attempting toggle or slideToggle (?)
I have a div block with some text ... half of which is hidden (at first) in a span. When clicking on a link at the end of the visible half of text, the remaining half should slideToggle, revealing itself and hiding the link that the user just clicked on.
All works great except an extra newline <br> seems to appear where the link was and I cannot seem to get rid of it.
Any assistance would be greatly appreciated!
<html>
<head>
<script type="text/javascript">
$(document).ready(function() {
$("span.longdesc").hide();
$("a.elipsis").click(function (event) {
event.preventDefault();
$($(this).attr('href')).slideToggle("slow");
$(this).siblings("a.elipsis").toggle();
$(this).toggle();
});
});
</script>
</head>
<body>
<div style="text-align:justify" id="invBody">This is the first half of the text <a class="elipsis"
href="#span1">... [click for more]</a><span class="longdesc" id="span1">and this would be the second hidden half.
As you can see an undesireable newline appears where the "[click for more]" link existed.</span><a class="elipsis"
style="display:none;" href="#span1">[Hide]</a></div>
</body>
</html>