Search code examples
javascriptselectors-api

Delete   from all elements of the same class


I was looking for a way to search through all elements of the same class and remove any   as these were causing unwanted gaps in my page layout.

Initially I used this code:

var el = document.querySelector('.offer');
el.innerHTML = el.innerHTML.replace(' ', '');

But this only finds the first node with the class of offer so isn't much use.


Solution

  • I'm answering my own question because I had to piece it together from a number of posts on here as well as other sites and I hope it helps others in my position.

    Firstly I needed to use .queryselectorAll instead of .querySelector to return all elements with the offer class.

    But the next line wont work since .queryselectorAll returns a string of nodes rather than just the first one it comes across.

    el.innerHTML = el.innerHTML.replace(' ', '');
    

    The solution is to loop through each element and replace each instance of  

    var el = document.querySelectorAll('.offer');
    for(var i = 0; i < el.length; i++){
      el[i].innerHTML = el[i].innerHTML.replace('&nbsp;', '');
    }