Clash Royale CLAN TAG#URR8PPP

Remove a wild “-” dash from active class anchor tag

I have used this https://jsfiddle.net/u9d1ewsh/ to add pagination in my table, which works fine. The issue is a wild "-" dash appearing on the active page number (please see pic below). I have checked the same using Developer tools, its not a character and it happens to be only for active class. What do I do to remove it ?

$(document).ready(function ()
$('#tblAH1').after('<div id="pager" style="" ></div>');
var rowsShown = 5;
var rowsTotal = $('#tblAH1 tbody tr').length;
var numPages = rowsTotal / rowsShown;
for (i = 0; i < numPages; i++)
var pageNum = i + 1;
$('#pager').append('<a href="#" rel="' + i + '">' + pageNum + '</a> ');

$('#tblAH1 tbody tr').hide();
$('#tblAH1 tbody tr').slice(0, rowsShown).show();
$('#pager a:first').addClass('active');
$('#pager a').bind('click', function ()

$('#pager a').removeClass('active');
$(this).addClass('active');
var currPage = $(this).attr('rel');
var startItem = currPage * rowsShown;
var endItem = startItem + rowsShown;
$('#tblAH1 tbody tr').css('opacity', '0.0').hide().slice(startItem, endItem).
css('display', 'table-row').animate( opacity: 1 , 300);
event.preventDefault();
);
);


#pager
display: inline-block;
align-items: center;


#pager a
color: black;
float: left;
padding: 4px 8px;
text-decoration: none;


#pager a.active
background-color: #fb9a55;
padding: 4px 8px;
color: white;


#pager a:hover:not(.active)
background-color: #ddd;



-

2 Answers
2

Add the following css, the line may be generated by a pseudo selector

.active:before,.active:after
content:"";
display:none;



if you have other libraries like bootstrap its possible that the active class is styled with that line, ether you override the css or you change your class name

active

Try this:

$('#pager').append('<a href="#" rel="' + i + '">' + pageNum.replace('-','') + '</a> ');


By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.