Removing a link from an html element using JQuery

Question

The company I am working for handed me over a messy website ran using templates, so some elements in the website are automatically generated and are active links.

My main problem is that there are some elements on the site are active links that aren't suppose to be links at all. I was wondering if there is a way to remove the link from an html element using JQuery and maybe CSS?

this will help me tremendously, thanks in advance. I need to remove all href's from class 'slider'.

Here is some of my jquery, can someone please show me how to add it?

<script type="text/javascript">
    $(document).ready(function(){
        $("#productsLink").hover(function(){
            $("#productsMenu").slideDown();
        });
        $("#productsLink, #productsMenu").hover(function(){
            $("#productsLink").css("color","red");
        });
        $(".spacer", this).hover(function(){
            $("#productsLink").css('color', 'white');
            $("#productsMenu").slideUp();
            $("#aboutLink").css('color', 'white');
            $("#aboutMenu").slideUp();
        });
    });
    </script>

Answer 1

如果要从DOM中删除带有类名slider链接：

$('a.slider').remove();

Answer 2

You can remove all href attributes from links with class slider with this code:

$('a.slider').removeAttr('href')

This will keep the content of the elements intact and just disables them as a link.

Answer 3

尝试使用.unwrap()展开滑块，假设所有这些链接都具有类slider ，并且直接将它们包装在锚定标记中。

$('.slider').unwrap()

Answer 4

CSS is no help here, it could only be used to hide elements completely.

You can use the replaceWith method to turn specific a elements into span elements. Example:

$('a.something, a.someother').replaceWith(function(){
  return $('<span/>').text($(this).text());
});