current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
up vote 0 down vote favorite

So I'm currently using Handlebars to grab data from a JSON file to show its data on the screen. Right now it's looking similar to this:

<div class="content" id = "topic">
  {{#each topics}}
     <a href="{{topic}}" id = "ignore">
         <h2>{{topic}}</h2>
     </a>
  {{/each}}
</div>

I want to replace specific characters within the word topic with another one, for example if the {{topic}} was "Hi%3F" I want to replace the "%3F" part with a '?' everywhere except the part with id="ignore". The replace function I'm using right now is: 

$("#topic").html($("#topic").html().replace(/%3F/g,'?'));

this manages to replace everything so far, but I'm not sure how to get it to ignore the tags with the id="ignore". There's probably an easier way to make the link portion work like its supposed to but this is what I have gotten now and I don't want to mess around or change too much.

Thanks!

share|improve this question
1  
"tags with the id="ignore"" doesn't sound right, ids should be unique within a document. – Teemu 2 hours ago
    
@Edward what Teemu said is correct! you don't want to have the same id's for every link. You may want to use a class instead – HenryDev 2 hours ago
    
Hmm will that make a difference though? I guess to put it in different terms I want to run my jquery script on the div with the id="topic" (sorry before it said title and that was a typo) but ignore the <a> tag with the id="ignore" if that makes sense. – Edward To 2 hours ago
    
@EdwardTo looks like you are doing a loop and assigning the same id = 'ignore' to each link and that is wrong. You CANNOT have the same id for each link. You're html still doesn't make any sense – HenryDev 2 hours ago
    
Oh ok. Any advice on what to do then? Other than changing it to class? – Edward To 2 hours ago
up vote 0 down vote

Is not legal html to duplicate Ids. Ids need to be unique. I'd suggest adding a class="unique" to your anchor tag and use 

<div class="content" id = "topic">
     <a href="Hi%3F" class = "topic">
       <h2>Hi%3F</h2>
     </a>
     <a href="Hi%3F" class = "topic ignore">
       <h2>Hi%3F</h2>
     </a>
     <a href="Hi%3F" class = "topic">
       <h2>Hi%3F</h2>
     </a>
     <a href="Hi%3F" class = "topic ignore">
       <h2>Hi%3F</h2>
     </a>
</div>

<script>
    $("a.topic").not(".ignore").each(function() {
      $(this).html($(this).html().replace(/%3F/g,'?'));
    });
</script>

http://jsbin.com/huquyufafe/edit?html,output

share|improve this answer
    
And you have no text within your anchor tags. It looks like its closing tag should really be below <h2>{{topic}}</h2> – K Scandrett 2 hours ago
    
Hmm for some reason it's not working... I changed the id to class="unique" but the URL still ends up having a '?' in it. – Edward To 2 hours ago
    
@K Scandrett oh sorry that was another typo. I'll change it. Thanks! – Edward To 2 hours ago
    
OH WAIT I GOT IT! I switched it around and added a "class=topic" inside of the h2's so instead of ignoring I just found the specific ones with the class to change that. – Edward To 2 hours ago

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.