How I do replace

and remove href attribute at the same time?

Question

I am using WHMCS (owned licensed without branding), however I want to change the layout a bit. The part I want to change is IONcube encoded, so I have to rely on Javascript (or DOM even?) to make those changes.

The ID name is: ClientAreaHomePagePanels-Active_Products_Services-0 It ranges from 0 to whatever the amount of products the customer has.

From that ID I want to change the displayed   into {$LANG.gekoppeldaan}

Secondly; I also want to remove the href tag from that same ID, since we don't use those pages it's pointing to.

I already had some success with replacing the   by using:

<script>
$(function() {
   $('#ClientAreaHomePagePanels-Active_Products_Services-0 br').replaceWith(' {$LANG.gekoppeldaan} ');
   $('#ClientAreaHomePagePanels-Active_Products_Services-1 br').replaceWith(' {$LANG.gekoppeldaan} ');
   $('#ClientAreaHomePagePanels-Active_Products_Services-2 br').replaceWith(' {$LANG.gekoppeldaan} ');
   $('#ClientAreaHomePagePanels-Active_Products_Services-3 br').replaceWith(' {$LANG.gekoppeldaan} ');
   $('#ClientAreaHomePagePanels-Active_Products_Services-4 br').replaceWith(' {$LANG.gekoppeldaan} ');
   $('#ClientAreaHomePagePanels-Active_Products_Services-5 br').replaceWith(' {$LANG.gekoppeldaan} ');
   $('#ClientAreaHomePagePanels-Active_Products_Services-6 br').replaceWith(' {$LANG.gekoppeldaan} ');
   $('#ClientAreaHomePagePanels-Active_Products_Services-7 br').replaceWith(' {$LANG.gekoppeldaan} ');
   $('#ClientAreaHomePagePanels-Active_Products_Services-8 br').replaceWith(' {$LANG.gekoppeldaan} ');
   $('#ClientAreaHomePagePanels-Active_Products_Services-9 br').replaceWith(' {$LANG.gekoppeldaan} ');
   $('#ClientAreaHomePagePanels-Active_Products_Services-10 br').replaceWith(' {$LANG.gekoppeldaan} ');
});
</script>

I somehow doubt this is a "clean" way to do this and if a customer has over 100 products, I have to create 100 of those lines. Which isn't very clean.

I haven't tried removing the href tag, simply because I don't know how.

So my question is, can someone provide some kind of clean code which replaces all

<br></br>

with {$LANG.gekoppeldaan} for all current and upcoming ID's called ClientAreaHomePagePanels-Active_Products_Services-0 and at the same time removes the href tag/url from it.

As mentioned above the ID ClientAreaHomePagePanels-Active_Products_Services-0 increases by one for every product the customer has. So instead of adding these manually, there must be an automatic way, right? Maybe through javascript and/or DOM.

I hope I was clear enough.

//update

Thanks to Andreas (comment) and Axel I managed to get it working! Many thanks.

I used this:

<script>
$('[id^="ClientAreaHomePagePanels-Active_Products_Services-"] br').replaceWith(" {$LANG.gekoppeldaan} ");
$('[id^="ClientAreaHomePagePanels-Active_Products_Services-"]').removeAttr('href');
</script>

I will help you, please add how before 2 tags with #ClientAreaHomePagePanels-Active_Products_Services-X are looking and what should be the result. — SilentTremor, Sep 18 '15 at 12:00
Use the "attribute value starts with" selector `^=` -> `$("[id^=ClientAreaHomePagePanels-Active_Products_Services-]" br)` [fiddle](https://jsfiddle.net/1u7pfrfz/) — Andreas, Sep 18 '15 at 12:02

score 1 · Accepted Answer · answered Sep 18 '15 at 12:05

Add an additional, empty class to all of these entries:

<... id="ClientAreaHomePagePanels-Active_Products_Services-0" 
           class="ClientAreaHomePagePanels-Active_Products_Services" .... />

work with jQuery each iterator:

$('.ClientAreaHomePagePanels-Active_Products_Services br').each(function(index, elem) {

      $(elem).replaceWith(' {$LANG.gekoppeldaan} ');
      $(elem).removeAttr('href');

};

Mind the .Client...selector which will find all elements of that class, regardless how many that are

SilentTremor · Answer 2 · 2015-09-18T13:01:59.610

I suppose u have anchors..

$( "a[id*='ClientAreaHomePagePanels-Active_Products_Services-']" ).each( function( index, element ){
    $(element).prepend(' {$LANG.gekoppeldaan} ');
    var kiddos = $(element).children("br");
    if (kiddos != undefined)
      {
          kiddos[0].remove();
          if (kiddos.length > 1)
          kiddos[1].remove();
       }
    $(element).removeAttr('href');
    
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
    <a id="ClientAreaHomePagePanels-Active_Products_Services-1" href="#">
        <br>
        </br>
        <img src="http://t2.gstatic.com/images?q=tbn:ANd9GcQhud2eyWOjWo44aQhYedOM7GCl4rUbNxx_UpGtb2x_t04DU9qI" width=650px" />
    </a>
    <a id="ClientAreaHomePagePanels-Active_Products_Services-2"  href="#">
        <br>
        </br>
         <img src="http://t2.gstatic.com/images?q=tbn:ANd9GcQhud2eyWOjWo44aQhYedOM7GCl4rUbNxx_UpGtb2x_t04DU9qI" width=650px" />
    </a>
    <a id="ClientAreaHomePagePanels-Active_Products_Services-3"  href="#">
        </br>
        <br>
          <img src="http://t2.gstatic.com/images?q=tbn:ANd9GcQhud2eyWOjWo44aQhYedOM7GCl4rUbNxx_UpGtb2x_t04DU9qI" width=650px" />
    </a>

Add more details how you want to do it, you will face some problems if you are using underscore or some dependency injections.

This removes everything? Not just the ? The only things it's now showing is the language text variable. — Joanne, Sep 18 '15 at 12:37
ok I will fix it, but I asked you to show me original html and desired result, btw
br> check w3c or http://stackoverflow.com/questions/1946426/html-5-is-it-br-br-or-br is incorect — SilentTremor, Sep 18 '15 at 12:41
Yeah I know it's not w3c, but as mentioned this is created by WHMCS, not by me! Also it's encoded in IonCube, so I cannot change it obviously. — Joanne, Sep 18 '15 at 12:43

How I do replace and remove href attribute at the same time?

2 Answers2

How I do replace

and remove href attribute at the same time?